Когда я запускаю webpack dev server, он выдает мне ссылку localhost, такую как http://localhost:8080/, когда я вхожу, я получаю каталог моего файла, как на картинке ниже.
И только если я нажимаю на мой каталог html (вмоя папка build ) Я перенаправляю свою страницу index.html.
Если я удаляю index.html из build , чтобы он работал. Но мне нужен этот каталогдистрибутив, потому что у меня будет несколько html файлов в текущем проекте.
Моя версия веб-пакета
"webpack": "^4.8.3"
Как мне решить эту проблему, пожалуйста, помогите?
My webpack.config.js
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const webpack = require('webpack');
let conf = {
entry:{
index: "./src/main/index.js"
},
output: {
path: path.resolve(__dirname, "./dist"),
filename:"[name]bundle.js",
publicPath:"dist/"
},
devServer: {
overlay:true
},
module: {
rules: [
{
test: /\.js/,
loader:"babel-loader",
//exclude: "/node_modules/"
},
{
test:/\.scss$/,
use: ExtractTextPlugin.extract({
fallback: "style-loader",
use: [
{
loader: 'css-loader',
options: {
// If you are having trouble with urls not resolving add this setting.
// See https://github.com/webpack-contrib/css-loader#url
url: false,
minimize: true,
sourceMap: true
}
},
{
loader: 'sass-loader',
options: {
sourceMap: true
}
}
]
})
}
]
},
plugins: [
new ExtractTextPlugin({
filename:"[name].css"
}),
new HtmlWebpackPlugin({
filename:"index.html",
template:"build/index.html",
hash:true,
chunks:["index"]
}),
new webpack.ProvidePlugin({
'$': "jquery",
'jQuery': "jquery",
'Popper': 'popper.js',
"Bootstrap":"bootstrap.js"
})
]
};
module.exports = (env, options) => {
let production = options.mode === "production";
conf.devtool = production ? false : "eval-sourcemap";
return conf;
}