学习用npm管理react,用webpack打包,配置完npm start 的时候出错了。
package.json是这样的:
{
"name": "react-webpack",
"version": "1.0.0",
"description": "practice",
"main": "index.js",
"scripts": {
"start":"node server.js"
},
"keywords": [
"react",
"webpack"
],
"author": "lxy",
"license": "ISC",
"dependencies": {
"babel": "^6.5.2",
"babel-core": "^6.10.4",
"react": "^15.1.0",
"react-dom": "^15.1.0",
"webpack": "^1.13.1"
},
"devDependencies": {
"react-hot-loader": "^1.3.0",
"webpack-dev-server": "^1.14.1"
}
}
webpackage.config.js这样的:
var webpack = require('webpack');
module.exports={
entry:'./js/index.js',
output:{
path:_dirname + '/js/',
filename:'bundle.js',
publicPath: '/js/'
},
module:{
loaders:[
{test:/\.js$/,loaders: ['babel-loader'],exclude: /node_modules/}
]
},
resolve:{
extensions:['','.js','.jsx']
}
};
server.js:
var webpack = require('webpack');
var WebpackDevServer = require('webpack-dev-server');
var config = require('webpack.config.js');
new WebpackDevServer(webpack(config),{
publicPath: config.output.publicPath,
hot:true,
historyApiFallback: true
}).listen(3333,'localhost',function(err,result){
if(err){
console.log(err);
}
console.log('Listen at localhost:3333');
});
index.js
var React = require('react');
var HelloWorld = React.createClass({
render:function(){
return (
<h1>helloworld!!</h1>
);
}
});
ReactDOM.render(<HelloWorld />,document.getElementById("app"));
错误信息:
server.js里这句话改改: