marketingsystem_temp_h5/build/webpack.com.js

84 lines
2.5 KiB
JavaScript

const CompressionPlugin = require("compression-webpack-plugin");
const path = require("path");
const { VueLoaderPlugin } = require("vue-loader");
const TerserPlugin = require("terser-webpack-plugin");
module.exports = {
mode: 'production', // 生产模式,会开启 tree-shaking 和 压缩代码,以及其他优化
entry: { // 后续需要上传哪个组件单独配置入口,其余注释
list: '@/views/templates/cmsList/index.ts',
detail: '@/views/templates/cmsDetail/index.ts',
// ...
},
output: {
path: path.join(__dirname, '../dist'),
filename: '[name]/[name]_com.[chunkhash:8].chunk.js',
library: {
name: 'TempCom',
type: 'umd', // 使用 UMD 模式以支持多种引入方式
},
publicPath: '/',
clean: true,
},
module: {
rules: [
{
test: /\.vue$/,
exclude: /node_modules/,
use: ['thread-loader', 'vue-loader'],
},
{
test: /\.(js|ts)$/,
exclude: /node_modules/,
use: ['thread-loader', 'babel-loader'],
},
{
test: /\.css$/,
use: ['vue-style-loader', 'css-loader'],
},
{
test: /\.scss$/,
use: ['vue-style-loader', 'css-loader', 'sass-loader']
}
]
},
plugins: [
new VueLoaderPlugin(), // vue-loader 插件
// 使用 CompressionPlugin 压缩静态资源
// new CompressionPlugin({
// algorithm: 'gzip', // 指定压缩算法
// test: /\.js(\?.*)?$/i, // 正则匹配需要压缩的文件
// threshold: 10240, // 对超过10k的数据进行压缩
// minRatio: 0.8, // 压缩比例
// deleteOriginalAssets: false, // 是否删除原文件
// }),
],
optimization: {
minimize: true,
minimizer: [
new TerserPlugin({
terserOptions: {
compress: {
// drop_console: true, // 移除所有的`console`语句
},
output: {
comments: false, // 去掉注释
},
},
extractComments: false, // 不从代码中提取注释
}),
],
},
resolve: {
// 如果用的是pnpm 就暂时不要配置这个,会有幽灵依赖的问题,访问不到很多模块
// 查找第三方模块只在本项目的node_modules中查找
modules: [path.resolve(__dirname, '../node_modules')],
extensions: ['.vue', '.ts', '.js', '.json'],
alias: {
'@': path.join(__dirname, '../src')
}
},
cache: {
type: 'filesystem', // 使用文件缓存
},
}