gpt4 book ai didi

reactjs - 在 create-react-app 应用程序中构建bundle.js

转载 作者:行者123 更新时间:2023-12-03 14:25:39 24 4
gpt4 key购买 nike

做了一个项目。现在我们需要将所有内容收集在一个 bundle.js 中,而不是以 create-react-app 的方式。

执行eject命令,配置出现。但是我如何获得bundle.js

将项目中的所有内容(样式、图片等)收集到一个文件中非常重要。

## 我的解决方案

webpack.config.js:

const path = require("path");
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const HtmlWebpackPlugin = require("html-webpack-plugin");

module.exports = {
context: __dirname,
entry: "./src/index.js",
output: {
path: path.join(__dirname, "/dist"),
publicPath: '',
filename: "widget.js"
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: ["babel-loader"]
},
{
test: /\.css$/,
use: ["style-loader", "css-loader"]
},
{
test: /\.(gif|png|jpe?g|svg|woff(2)?|ttf|eot)$/i,
use: [
{
loader: 'file-loader',
options: {
publicPath: 'img',
outputPath: 'img',
name: '[name].[ext]',
},
},
],
}
]
},
optimization: {
minimizer: [new UglifyJsPlugin({
uglifyOptions: {
warnings: false,
parse: {},
compress: {},
mangle: true,
output: {
comments: false,
},
toplevel: false,
nameCache: null,
ie8: true,
keep_fnames: false,
},
})],
},
plugins: [
new HtmlWebpackPlugin({
template: "./public/index.html"
})
]
};

最佳答案

弹出是一个非常糟糕的解决方案,而是使用重新接线npm install react-app-rewired并添加自定义的构建脚本。

请在这里查看我的回答 How to build a production version of React without minification?

关于reactjs - 在 create-react-app 应用程序中构建bundle.js,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54449242/

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