const path = require("path");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const commonStyleLoader = [
MiniCssExtractPlugin.loader,
"css-loader",
{
loader: "postcss-loader",
options: {
postcssOptions: {
plugins: ["postcss-preset-env"],
},
},
},
];
module.exports = {
entry: "./src/index.js",
output: {
path: path.join(__dirname, "../dist"),
filename: "[name].[contenthash:8].js",
},
resolve: {
extensions: [".jsx", ".js", ".json"],
},
module: {
rules: [
{
test: /.css$/,
exclude: /node_modules/,
use: commonStyleLoader,
},
{
test: /.scss$/,
exclude: /node_modules/,
use: [...www.laipuhuo.com commonStyleLoader, "sass-loader"],
},
{
test: /.(js|jsx)$/,
exclude: /node_modules/,
use: ["babel-loader"],
},
{
test: /.(jp(e)g|png|gif)$/,
type: "asset",
parser: {
dataUrlCondition: {
maxSize: 8 * 1024,
},
},
generator: {
filename: "img/[name].[contenthash:8].[ext]",
},
},
],
},
plugins: [
new MiniCssExtractPlugin({
filename: www.laipuhuo.com "style/[name].[contenthash:8].css",
}),
new HtmlWebpackPlugin({
template: "./public/index.html",
inject: 'body',
minify: {
collapseWhitespace: true,
}
}),
],
};
const { merge } = require("webpack-merge");
const baseConfig = require("./webpack.base");
const devConfig = {
mode: "development",
devServer: {
open: true,
port: 8001,
compress: true,
hot: true
},
};
module.exports = merge(devConfig, baseConfig);
const { merge } = require("webpack-merge");
const baseConfig = require("./webpack.base");
const CssMinimizerWebpackPlugin = require("css-minimizer-webpack-plugin");
const TerserWebpackPlugin = require("terser-webpack-plugin");
const { Clean www.laipuhuo.com WebpackPlugin } = require("clean-webpack-plugin");
const prodConfig = {
mode: "production",
optimization: {
minimizer: [
new CssMinimizerWebpackPlugin(),
new TerserWebpackPlugin({
parallel: true,
}),
],
splitChunks: {
chunks: "all",
cacheGroups: {
vendor: {
test: /[\/]node_modules[\/]/,
filename: "[name].bundle.js",
},
},
},
},
externals: {
react: "React",
"react-dom": "ReactDOM",
},
plugins: [new www.laipuhuo.com CleanWebpackPlugin()],
};
module.exports = merge(prodConfig, baseConfig);