19

我已经成功设置了 WebPack - 它可以很好地编译我的 babel 和 SCSS 文件，并且我的手表功能可以正常工作。但我也想使用热模块更换 - 我很难让它继续下去。当我在浏览器中加载开发服务器时，它显示Cannot resolve module 'webpack/hot/dev-server'. 我的配置如下所示：

import webpack from 'webpack';
import wpServer from 'webpack-dev-server';

var compiler = webpack({
    entry: [
        './src/core.js',
        'webpack/hot/dev-server'
    ],
    output: {
        path: outPath,
        filename: '[name].js'
    },
    resolveLoader: { root: path.join(MODULE_PATH, "node_modules") },
    module: {
        loaders: [
          { test: /\.js$/, exclude: /node_modules/, loader: 'babel-loader' },
          { test: /\.scss$/, loader: "style!css!sass" }
        ]
    },
    plugins: [new webpack.HotModuleReplacementPlugin()],
    watch: true
});

var server = new wpServer(compiler, {
    contentBase: outPath,
    hot: true,
    quiet: false,
    noInfo: false,
    lazy: true,
    filename: "main.js",
    watchDelay: 300,
    headers: { "X-Custom-Header": "yes" },
    stats: { colors: true },
});
server.listen(8080, "localhost", function() {});

我的 index.html 包含：

<script src="http://localhost:8080/webpack-dev-server.js"></script>
<script src='main.js'></script>

有没有人有任何想法？

4

3 回答 3

14

如果您webpack-dev-server是全局安装的，即npm install webpack-dev-server -g，请尝试在本地安装（只需删除选项-g）。

我通过这样做解决了这个问题。

于 2015-05-27T13:05:47.740 回答
6

重要的

如果你使用webpack@2.xxbeta确保你安装

webpack-dev-server@2.0.0-beta

只是运行npm install webpack-dev-server不会与 webpack 2 配合得很好。

这可能仅在版本 2 仍处于测试阶段时才会成立。

由于有关此主题的文档非常分散，因此我也很难使其正常工作。

找到了这个简单的工作示例：

https://github.com/ahfarmer/webpack-hmr-starter-dev-server-api

代码非常不言自明。

于 2016-04-15T15:20:14.620 回答
4

我遇到了类似的问题。我通过在本地安装 webpack 本身来修复它。将 webpack 安装为本地开发依赖项： npm i -D webpack

于 2016-03-01T03:24:32.407 回答