做了一个项目。现在我们需要将所有内容收集在一个 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/