gpt4 book ai didi

javascript - Webpack 配置不在公共(public)文件夹中生成 index.html

转载 作者:行者123 更新时间:2023-11-30 20:56:20 26 4
gpt4 key购买 nike

我的 webpack 配置有点问题,出于某种原因,它没有在我的/public 文件夹中创建 index.html 文件。

请参阅下面的 webpack.config.js:

const path = require("path");
const ExtractTextPlugin = require("extract-text-webpack-plugin");

let DEBUG;

if (process.env.NODE_ENV === "production") {
DEBUG = false;
} else {
DEBUG = true; // process.env.NODE_ENV === "development"
}
//const DEBUG = true; // process.env.NODE_ENV === "development"

module.exports = {
context: path.resolve(__dirname, "src"),
entry: "./index.js",
output: {
path: path.resolve(__dirname, "public"),
filename: DEBUG ? "bundle.js" : "bundle.min.js"
},
module: {
loaders: [
{
test: /\.js$/,
loader: "babel-loader",
exclude: /node_modules/
},
{
test: /\.jsx$/,
loader: "babel-loader",
exclude: /node_modules/,
options: {
presets: ["react", "es2015"]
}
},
{
test: /\.scss$/,
loaders: DEBUG
? [
"style-loader",
"css-loader?sourceMap",
"sass-loader?sourceMap",
"postcss-loader"
]
: ExtractTextPlugin.extract("css-loader!sass-loader!postcss-loader")
},
{
test: /\.(ttf|eot|svg)(\?[\s\S]+)?$/,
use: "file-loader?name=images/[name].[ext]"
}
]
},
devServer: {
historyApiFallback: true,
hot: true,
},
plugins: [
new ExtractTextPlugin("style.css", {
allChunks: true
})
]
};

我在我的根目录中有一个,当我在开发模式下运行时一切正常。构建脚本是 "build": "NODE_ENV='production' webpack -p"。

谢谢

最佳答案

您需要 HTML Webpack 插件。这个插件为你创建 html 文件,并将 webpacks entry prop 中定义的每个条目添加到你的 html 中。不要忘记安装它。

$ npm install html-webpack-plugin --save-dev

然后在你的 webpack 配置中:

var HtmlWebpackPlugin = require('html-webpack-plugin');

...

plugins: [
new ExtractTextPlugin("style.css", {
allChunks: true
}),
new HtmlWebpackPlugin()
]

更多信息请看这里: https://github.com/jantimon/html-webpack-plugin

关于javascript - Webpack 配置不在公共(public)文件夹中生成 index.html,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47619892/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com