-
Notifications
You must be signed in to change notification settings - Fork 3.7k
【vue2】小程序平台使用组件 style 时,编译后多出 mini-css-extract-plugin 的 css runtime 代码 #5333
Copy link
Copy link
Closed
Labels
questionFurther information is requestedFurther information is requested
Description
问题分类
uni-app
问题描述
使用组件后,dist/build/mp-weixin/common/runtime.js 会多出一段 mini-css-extract-plugin 的 css runtime 代码,这段代码在小程序平台是没用的,都没有 document 对象可用。并且这个代码是根据组件使用动态增加的,使用的组件越多,这段代码占的体积就会越大。
问题来源
mini-css-extract-plugin 2.3.0 版本后就新增了 runtime 选项,可以关闭这个 runtime 注入。
mini-css-extract-plugin 低于 2.3.0 的版本可以通过自定义插件的方法手动去除这段 runtime 注入。
if(require('semver').lt(require('mini-css-extract-plugin/package.json').version, '2.3.0')) {
const pluginName = 'skip-mini-css-extract-runtime'
webpackConfig.plugin(pluginName).use(
class SkipMiniCssExtractRuntimePlugin {
apply(compiler) {
compiler.hooks.thisCompilation.tap(pluginName, compilation => {
const { mainTemplate } = compilation;
const reg = /\/\/ mini-css-extract-plugin CSS loading[\s\S]*installedCssChunks\[chunkId\] = 0;\s*\}\)\);\s*\}/;
mainTemplate.hooks.requireEnsure.tap(pluginName, (source, chunk) => {
return reg.test(source) ? source.replace(reg, ''): source;
});
});
}
}
)
}附加信息
No response
Reactions are currently unavailable
Metadata
Metadata
Assignees
Labels
questionFurther information is requestedFurther information is requested