Question

更新当前问题：

似乎webpack hot loader出错了，因为当我运行以下cmd：webpack时，它可以照常构建。但是当我运行“”dev“：”webpack-dev-server --color - hot --progress＆amp;＆amp; node ./server.js""webpack无法为我生成构建的文件。

我的webpack.config如下：

module.exports = {
    entry: getEntries(),

.....

function getEntries(){
var routeDir = path.join(SRC_DIR,"javascripts","routes");
var routeNames = routeDir?fs.readdirSync(routeDir):[];

var nameMaps = {};
routeNames.forEach(function(routeName){
    var filename = routeName.match(/(.+)\.js$/)[1];
    console.log("filename in entry ",filename);
    if(filename){
        var devEntryPath = [
            'webpack-dev-server/client?http://127.0.0.1:3001', // WebpackDevServer host and port
            'webpack/hot/only-dev-server',
            path.join(routeDir,filename)
        ];
        nameMaps[filename] = devEntryPath;

    }
});
return nameMaps;
}

server.js

  var server = new WebpackDevServer(webpack(config), {
  publicPath: config.output.publicPath,
  hot: true,
  historyApiFallback: true
}).listen(3001,'localhost',function(err,result){
    if(err) console.log(err);
    console.log("webpack listening at port 3001");
});
var app = express();


app.get("/monitor/index",function(req,res){
    res.sendFile(__dirname+"/src/views/"+"page1.html");
});
app.get("/monitor/category/*",function(req,res){
    res.sendFile(__dirname+"/src/views/"+"page2.html");
});

app.use(express.static(__dirname))
        .listen(9090, 'localhost', function (err, result) {
              if (err) console.log(err);
              console.log('Listening at localhost:9090');
});

Answer 1

最后，我找到问题所在，并了解webpack-dev-server和我的快递服务器之间的关系。

在webpack-dev-server中使用hot-loader时： step1：webpack将输入文件构建到publicPath（在webpack.config.js的＆＃34;输出＆＃34;中指定）。 step2，节点服务器将html发送到前端，并搜索相关资产（如js，img等），但在哪里？我们可以将脚本（与html相关）路径更改为webpack-dev-server。（刚刚由step1生成），因此node-server将向webpack-dev-server请求帮助。总结一下，我修改了3个地方：

webpackDevServer的publicPath
webpack输出（publicPath），等于上面的
html中的脚本路径。

全部。现在，我的项目可以按预期运行。

webpack-dev-server无法正常工作

1 个答案: