配置@rollup/plugi-commonjs插件处理混合模块

基础环境

rollup ^3.0.0

rollup的treeshake

测试包为lodash-es。

rollup的treeshake默认是开启的。

测试：将rollup的treeshake关闭

treeshake:false，重新打包后的文件大小为504KB。

treeshake:true，重新打包后的文件大小为6KB。

rollup插件rollup-plugin-delete,在bundling之前删除指定文件或文件夹

rollup插件rollup-plugin-commonjs

报错：RollupError: "default" is not exported by "node_modules/lodsh/isPlainObject.js"

使用@rollup/plugin-commonjs替换rollup-plugin-commonjs

报错： RollupError: "TreeNode" is not exported by "node_modules/ant-design-vue/es/vc-tree/index.js"。

解决方案：

使用@rollup/plugin-commonjs替换rollup-plugin-commonjs

使用@rollup/plugin-node-resolve替换rollup-plugin-node-resolve

参考：https:/rollupjs.org/troubleshooting/#error-name-is-not-exported-by-module

@rollup/plugi-commonjs插件配置如下：

const commonjs = require('@rollup/plugi-commonjs')

plugins: [
    commonjs({
        include: ['node_modules/**'],
        exclude: ['node_modules/lodash-es', 'node_modules/antd/**']
    })
]

一个esm文件中使用了require，导致require的文件未被引入。

修改@rollup/plugi-commonjs插件配置如下

const commonjs = require('@rollup/plugi-commonjs')

plugins: [
    commonjs({
        include: ['node_modules/**'],
        exclude: ['node_modules/lodash-es', 'node_modules/antd/**'],
        transformMixedEsModules: true //  混合模块转换
    })
]

transformMixedEsModules

类型：布尔

默认值：false

指示插件是否启用混合模块转换。这在包含ES导入语句和CommonJS require表达式的模块混合的场景中很有用。如果require调用应转换为混合模块中的导入，则设置为true，如果require表达式应在转换后继续存在，则设置成false。如果代码包含环境检测，或者您正在为对ElectronJS等require调用进行特殊处理的环境进行编码，则后者可能很重要。另请参见"忽略"选项。