正确的webpackconfiguration为babel 6，反应热负载，webpack中间件

在webpackconfiguration阅读小说的SOpost的价值，我仍然无法通过module parse failed错误。

package.json（不是全部）

 "dependencies": { "babel-core": "^6.7.6", "babel-loader": "^6.2.4", "babel-preset-es2015": "^6.6.0", "babel-preset-es2015-webpack": "^6.4.0", "babel-preset-react": "^6.5.0", "babel-preset-stage-0": "^6.5.0", "react": "^0.14.6", "react-dom": "^0.14.6", "react-hot-loader": "^1.3.0", "webpack": "^1.12.14", "webpack-dev-middleware": "^1.6.1", "webpack-hot-middleware": "^2.10.0" } 

结构体

 package.json node_modules .babelrc client/ webpack.config.js .babelrc # duplicated just for shits and giggles... src/ index.jsx components/ server/ index.js //more stuff 

客户机/ webpack.config.js

 var path = require('path'), webpack = require('webpack'); module.exports = { devtool: 'eval', context: __dirname + '/src', entry: [ 'webpack-hot-middleware/client', __dirname + '/src/index.jsx' ], output: { path: __dirname + '/public', filename: 'bundle.js', publicPath: 'http://localhost:12345' }, plugins: [ new webpack.optimize.OccurenceOrderPlugin(), new webpack.HotModuleReplacementPlugin(), new webpack.NoErrorsPlugin() ], module: { loaders: [ { test: /\.jsx$/, include: __dirname + '/src', loaders: ['react-hot', 'babel-loader?presets[]=react,presets[]=es2015,presets[]=stage-0'], query: { plugins: ['./babelRelayPlugin'], presets: ['es2015', 'react'] } } ] } }; 

.babelrc

 { "presets": ["react", "es2015", "stage-0"] } 

客户端/ src目录/ index.jsx

 import React from 'react'; import ReactDOM from 'react-dom'; import Layout from './src/components/layout.jsx'; ReactDOM.render(<Layout />, document.querySelector('#app')); 

一直在黑暗中修改webpackconfiguration戳，不能babel esp esp。

来自其他SOpost的重复性问题

1. Loaders数组必须在module属性中
2. 将presets数组添加到您的.babelrc
3. npm install --save babel-preset-whatever
4. hot-loader折旧，使用babel-preset-react-hmre
5. 装载机从右到左，从上到下装载

不知所措。

Answer 1

发现我的context属性是搞乱了一切，错误没有那么有用，但。 文档清楚地说明了context作用，我猜测我没有足够小心地注意这一点。

 //webpack.config.js context: __dirname + '/client/src/', target: 'web' //index.jsx //this will break everything import Layout from './src/components/Layout.jsx' //this will work import Layout from './components/Layout.jsx' 

我只是改变了这一切，现在一切正常。

Answer 2

易反应

我为自己创造了一个小小的首发。 只需检查我的configuration，它为我工作。