Webpack-开发服务器';无法获取/';
我有如下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
}
}
相关文章