Webpack TerserPlugin网页包排除/测试未按预期工作
我想对我的一些代码应用TerserPlugin进行优化,并从Terser处理中排除一些第三方LIB(例如vue),但无论我尝试什么测试,include和exclude都不起作用。 我的代码是用Typescript(只有*.ts文件和.vue文件)编写的,大多数第三方库都使用js编写,以防以后出现问题 我用下面的正则表达式和字符串进行了测试,包括和排除TerserPlugin,结果如下: 1.)没有指定测试条款,没有排除,没有包含:应用了简洁,例如,在我的资料和第三方LIB中替换了方法的局部变量。这实际上很奇怪,因为Webpack TerserPlugin网页包排除/测试未按预期工作,webpack,Webpack,我想对我的一些代码应用TerserPlugin进行优化,并从Terser处理中排除一些第三方LIB(例如vue),但无论我尝试什么测试,include和exclude都不起作用。 我的代码是用Typescript(只有*.ts文件和.vue文件)编写的,大多数第三方库都使用js编写,以防以后出现问题 我用下面的正则表达式和字符串进行了测试,包括和排除TerserPlugin,结果如下: 1.)没有指定测试条款,没有排除,没有包含:应用了简洁,例如,在我的资料和第三方LIB中替换了方法的局部变量。
test
默认设置是/\.m?js(\?*)$/
,根据这一设置,任何*.ts文件都不正确。因此,我的Typescript文件不应该由Terser处理,而是
2.test:/\.ts$/i
-我的文件或第三方LIB中没有更简洁的转换
3.包括:/\.ts$/i
-我的文件或第三方LIB中没有更简洁的转换
4.include:/entities/i
-我的文件(两个实体在一个目录名中)或第三方LIB中没有更简洁的转换
5.exclude:/vue/i
-应用了更简洁的方法,例如,在我的资料和第三方LIB中替换方法的局部变量
6.排除:“C:\Repositories\m2\node\u modules\vue\dist\vue.esm.js”
-应用Terser,例如,在我的资料和第三方库中替换方法的局部变量
7.exclude:“C:/Repositories/m2/node_modules/vue/dist/vue.esm.js”
-应用Terser,例如,在我的资料和第三方库中替换方法的局部变量
8.exclude:path.join(uuu dirname,'node_modules/vue/dist/vue.esm.js')
-应用Terser,例如在我的资料和第三方库中替换方法的局部变量
那对我来说毫无意义。我输入的任何内容似乎都失败了,例如,test和include似乎从来都不是真的,因此没有处理任何内容,exclude也从来都不是真的,因此所有内容都被处理。对我来说,这似乎是一个巨大的错误-太大,实际上我相信它是。有什么想法吗
这里是我的网页配置中的完整精简配置,标记了放置正则表达式的位置
optimization: {
namedModules: true,
chunkIds: 'size',
moduleIds: 'hashed',
removeAvailableModules: true,
removeEmptyChunks: true,
mergeDuplicateChunks: true,
usedExports: true,
minimize: true,
minimizer: [new TerserPlugin({
- place where i put the regex test, exclude condition --
extractComments: false,
sourceMap: false,
terserOptions: {
output: {
comments: true,// to change
beautify: true,// to change
},
ecma: 6,
warnings: true,// to change
parse: {},
mangle: {
eval: true,
// mangle options
keep_classnames: false,
keep_fnames: false,
module: true,
toplevel: true,
safari10: false,
},
nameCache: null,
ie8: false,
}
})],
我的TerserPlugin版本是:“terser网页包插件”:“^1.4.1”
如果有关系的话,尽管我想没有,这里是我的网页模块配置:
module: {
rules: [
{ test: /\.vue$/,
exclude: /node_modules/,
loader: 'vue-loader'
},
{ test: /\.ts$/,
exclude: /node_modules|vue\/src/,
loader: "ts-loader"
},
{ test: /\.woff(2)?(\?v=[0-9]+\.[0-9]+\.[0-9]+)?$/,
loader: "url-loader?limit=10000&mimetype=application/font-woff&name=[name].[ext]",
options: {
outputPath: './m2/fonts',
}
},
{ test: /\.(ttf|eot)(\?v=[0-9]+\.[0-9]+\.[0-9]+)?$/,
loader: "file-loader?name=[name].[ext]",
options: {
outputPath: './m2/fonts',
}
},
{ test:/\.sass$/,
use:['style-loader','css-loader', 'sass-loader']
},
{ test:/\.(s*)css$/,
use:['style-loader','css-loader', 'sass-loader']
},
{ test: /\.styl$/,
loader: ['style-loader', 'css-loader', 'stylus-loader']
},
{ test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env']
}
}
}
]
},
我的理解是,
Terser
对输出块有效,而不是对输入文件有效
例如,有一个chunkfilter选项:它表示:
允许过滤哪些区块应该丑化(默认情况下,所有区块都是丑化的)
include/exclude
选项更加模糊
因此,我总结道,为了不处理供应商脚本,您必须将它们放在一个单独的缓存组中:然后排除此供应商区块。认为插件可以与保存源代码的目录中的.ts文件和其他源文件一起工作是错误的。当插件开始工作时,.ts文件已经被转换成.js文件。请参阅和。非常感谢。这真的很有帮助!可能会打开文件的文件,因为我个人认为DOCU相当误导,谢谢。有道理。曾搜索过问题,但仅限于公开的问题。