Webpack: "Module parse failed" - gulp

Question

1.When I Execute command line, the Error is as follows：
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.Related configuration is as follows：
（1）Document structure：
（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）Entry file is 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.How to solve this problem?