Webpack：＆＃34;模块解析失败＆＃34;

Question

1.当我执行命令行时，错误如下：

D:\mypro\Demo\webpack\webpackgulp>webpack 
Hash: d6b7d6bad8ca0746b6ec
Version: webpack 1.13.1
Time: 46ms
   [0] ./src/main.js 0 bytes [built] [failed]

ERROR in ./src/main.js
Module parse failed: D:\mypro\Demo\webpack\webpackgulp\src\ma
ken (7:16)
You may need an appropriate loader to handle this file type.

2.相关配置如下：

（1）文件结构：

（2）webpack.config.js：

module.exports = {
  entry: "./src/main.js",
  output: {
    filename: "build.js",
    path: __dirname
  },
  module: {
    loaders: [
      {
        test: /\.less$/,
        loader: "style!css!less"
      }
    ]
  },
  resolve: {
    extensions: ['', '.js', '.jsx']
  },
  plugins: []
};

（3）输入文件是main.js：

// css
require('../css/main.less');

var ContentMode = React.createClass({
        render: function(){
            return (
                <div className="ContentMode">
                    <div class="contents">{this.props.contents}</div>
                    {this.props.children}
                </div>
            )
        }
});

var Page = React.createClass({
    render: function(){
        return (
            <div className="homepage">
                <ContentMode  contents ="longen">this is one comment</ContentMode >
                <ContentMode  contents ="longen2">this is two comment</ContentMode >
            </div>
            )
        }
});
/* init to content container */
React.render(
       React.createElement(Page,null),document.getElementById("content")
);

（4）node_modules：

3.如何解决这个问题？