Webpack-开发服务器&#39；无法获取/&#39； [英] webpack-dev-server 'Cannot GET /'

问题描述

我有如下webpack配置：

module.exports = {
  entry: "./src/index.js",
  output: {
    path: __dirname + '/dist',
    // publicPath: __dirname + '/dist/',
    filename: "bundle.js"
  },
  devServer: {
    contentBase: "/dist",
    hot: true,
  } 
}

我的理解是，contentBase告诉webpack开发服务器从哪里提供文件。因此，如果我转到localhost:8080/test.txt，在此配置下，myProjectRoot/dist/test/txt处的文件将由服务器发送到浏览器。对吗？output.publicPath与这一切有什么关系？

现在我有index.html和bundle.js坐在myProjectRoot/dist/中。(尽管我认为bundle.js是一个有点令人困惑的因素，因为它实际上是由webpack-dev-server返回的内存中捆绑包，但尽管如此)。根据我前面的段落，我预计服务器将向浏览器返回index.html。因为contentBase是/dist，index.html在磁盘上的路径是./dist/index.html。

但我看到的是：Cannot GET /

因此，如果我转到http://localhost:8080/bundle.js，我会看到完整的Java脚本包(与上次保存在文本编辑器中的内容是最新的)。但随后/index.html将以Cannot GET /胜出？

我错过了什么？

推荐答案

也许您可以尝试将Static添加到devServer？

此信息来自：https://webpack.js.org/configuration/dev-server/#devserverwatchfiles

我已将该文件放在同一文件夹中，因此我使用./作为我的路径。

我是这样做的：

devServer: {
   //....//
   static: {                               
     directory: path.join(__dirname, './'),  
     watch: true
   }
}

这篇关于Webpack-开发服务器&#39；无法获取/&#39；的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！