有了下面的配置,我就可以使用HotModuleReplacementPlugin()来替换热模块,但在运行webpack-dev服务器时不能使用--hot。我的问题是,为什么?
最近几乎所有关于设置热模块替换的指南都使用--热,但它对我不起作用。
var webpack = require("webpack");
var path = require("path");
const config = {
entry: path.resolve(__dirname, 'app/index.js') ,
output: {
path: path.resolve(__dirname, 'output'),
filename: 'bundle.js',
publicPath: "static/"
},
module: {
rules: [
{test: /\.(js|jsx)$/, use: 'babel-loader'}
]
},
plugins: [
new webpack.HotModuleReplacementPlugin()
]
};
module.exports = config;
我像这样引用我的代码文件。
<script src="static/bundle.js"></script>我像这样运行我的服务器。
webpack-dev-server --inline --colors --progress版本。
webpack-dev-server 2.3.0
webpack 2.2.1使用此设置,热模块加载工作正常。如果我删除插件,并运行服务器附加--热(正如我在许多例子中看到的),我的热模块加载不能工作。服务器注册更改,transpile发生,我的网页看起来像是在重新加载,但内容不更新。
我正在通过http://localhost:8080/webpack-dev-server/index.html访问
结构类似于这个+一个node_modules目录。
.
├── app
│ └── index.js
├── index.html
├── output
│ ├── bundle.js
│ └── index.js
├── package.json
└── webpack.config.js更新
还尝试将devServer添加到webpack配置中,结果是相同的。
devServer: {
compress: true,
publicPath: "http://localhost:8080/static/",
filename: "bundle.js",
hot: true,
inline: true}
发布于 2017-02-13 16:35:40
您可能还需要添加以下内容:
entry: {
'app': [
'webpack-dev-server/client?http://localhost:8080',
'webpack/hot/only-dev-server',
`${PATHS.SOURCE}/index.jsx`
]
}发布于 2017-02-13 14:00:26
在您的文件中设置了devServer属性吗?
devServer: {
...
historyApiFallback: true,
hot: true,
inline: true,
compress: true,
...
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
...
],
...package.json
"scripts": {
"development": "webpack-dev-server --progress --colors"
}https://stackoverflow.com/questions/42195351
复制相似问题