Question

尝试使用gulp设置webpack-dev-server。当发生更改时，webpack-dev-server似乎重建了bundle.js文件，但是如果我刷新页面，它仍然是相同的。我必须使用webpack手动编译bundle.js，并且每次都重新启动服务器。

gulpfile.js

gulp.task('webpack-dev-server', function() {
    var compiler = webpack(require('./webpack.config'));
    new WebpackDevServer(compiler, {
        contentBase: 'public',
        historyApiFallback: true,
        progress: true,
        inline: true
    }).listen(8000, 'localhost', (err) => {
                if(err) throw new $.util.PluginError('webpack-dev-server', err);
                $.util.log('[webpack-dev-server]', 'http://localhost:8000');
    });
});

webpack.config.js

module.exports = {
    entry: [
        './src/index.js'
    ],
    output: {
        path: __dirname + '/public/js',
        filename: 'bundle.js'
    },
    module: {
        loaders: [
            {
                test: /\.(jsx|js)$/,
                loader: "babel-loader",
                exclude: /node_modules/,
                query: {
                    presets: ["es2015", "react"]
                }
            }
        ]
    },
    resolve: {
        extensions: ['', '.js', '.jsx']
    },
    devServer: {
        contentBase: 'public',
        inline: true,
        progress: true
    }
};

Answer 1

发现问题：contentBase使用磁盘根作为项目的根而不是项目文件夹本身。所以这条路变成了公共＆＃34; F：\ public＆＃34;。我将其更改为contentBase: __dirname + 'public'并且确实有效。

gulp webpack-dev-server更改未应用

1 个答案: