node.js Webpack-dev-server 提供目录列表而不是应用程序页面
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/33382526/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Webpack-dev-server serves a directory list instead of the app page
提问by Jason Lam
I can only see the actual app under /public.
我只能在/public.
The configs in webpack.config.jsare below:
中的配置webpack.config.js如下：
var path = require('path');
var webpack = require('webpack');
module.exports = {
entry: [
'webpack-dev-server/client?http://localhost:8080',
'webpack/hot/only-dev-server',
'./app/js/App.js'
],
output: {
path: path.join(__dirname, 'public'),
filename: 'bundle.js',
publicPath: 'http://localhost:8080'
},
module: {
loaders: [
{
test: /\.js$/,
loaders: ['react-hot', 'babel-loader'],
exclude: /node_modules/
}
]
},
plugins: [
new webpack.HotModuleReplacementPlugin(),
new webpack.NoErrorsPlugin()
]
};
The project hierarchy is:
项目层次结构是：
app
- js
node_modules
public
css
img
bundle.js
index.html
package.json
webpack.config.js
应用程序
- js
节点模块
民众
css
图片
包.js
索引.html
包.json
webpack.config.js
How can I modify to make sure the http://localhost:8080/entry is for the application per se?
如何修改以确保http://localhost:8080/条目本身适用于应用程序？
采纳答案by Sandals
If you're using webpack's dev server you can pass in options to use /publicas a base directory.
如果您使用 webpack 的开发服务器，您可以传入选项以/public用作基本目录。
devServer: {
publicPath: "/",
contentBase: "./public",
hot: true
},
See the webpack configuration docs, and specifically the webpack dev server docsfor more options and general information.
有关更多选项和一般信息，请参阅webpack 配置文档，特别是webpack 开发服务器文档。
回答by kcstricks
You can also add the --content-baseflag to your start-up script, e.g.
您还可以将--content-base标志添加到您的启动脚本中，例如
"scripts": {
"start:dev": "webpack-dev-server --inline --content-base ./public"
}
回答by spencer.sm
In my case, I misspelled 'index.html'when I set up the HTMLWebpackPlugin. Double check your filenames if you're using this plugin.
就我而言，我'index.html'在设置HTMLWebpackPlugin. 如果您正在使用此插件，请仔细检查您的文件名。
var HTMLWebpackPlugin = require('html-webpack-plugin');
var HTMLWebpackPluginConfig = new HTMLWebpackPlugin({
template: __dirname + '/app/index.html',
filename: 'index.html',
inject: 'body'
});
回答by wwwwwwwwwwww
I had accidently removed index.html and then I got only the directory list.
我不小心删除了 index.html，然后我只得到了目录列表。
