标签：config latest har 需要 bar npm scripts filename 打开
近日自己项目遇到需要用webpack搭建react环境，查了挺多 ，自己总结一下
npm config set registry http://registry.npm.taobao.org/
npm install babel webpack webpack-dev-server -g
npm install react react-dom --save
npm install babel-loader babel-core babel-preset-react babel-preset-latest --save
文件目录最终为：
module.exports = {
entry: ‘./main.js‘, // 入口文件路径
output: {
path: ‘/‘,
filename: ‘index.js‘
},
devServer: {
inline: true,
port: 3333
},
module: {
loaders: [
{
test: /\.js$/, // babel 转换为兼容性的 js
exclude: /node_modules/,
loader: ‘babel-loader‘,
query: {
presets: [‘react‘, ‘latest‘]
}
}
]
}
}
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>React Hello World</title>
</head>
<body>
<div id="app"></div>
<script src="index.js"></script>
</body>
</html>
import React from ‘react‘;
class App extends React.Component {
render() {
return <div>Hello World!</div>
}
}
export default App
import React from ‘react‘; import ReactDOM from ‘react-dom‘; import App from ‘./App‘; ReactDOM.render(<App />, document.getElementById(‘app‘));
"scripts": {
"start": "webpack-dev-server"
},
npm start
标签：config latest har 需要 bar npm scripts filename 打开
原文地址：http://www.cnblogs.com/slcs/p/7427210.html
