webpack打包文件，import导入报export ‘default‘ (imported as.... was not found in ‘....filename.js‘

webpack打包项目时避免使用以下语句

1.使用typeof打包的结果，再以import引入 模块中时；

2.使用...运算符时，打包commonjs格式，再以import引入时；

3.使用class 声明的类对象，经过webpack5打包后，不能import引入；

会报错

export 'default' (imported as 'Kowledge') was not found in './js/Kowledge.min.js' (module has no exports)

Rollup打包成ES模块化，再import引入不会报错

全局安装

npm install -g rollup

推荐安装到项目中,devDependencies 中

npm install --save-dev rollup

验证版本

rollup --version

配置rollup.conf.js文件在根目录下

export default {

input: 'fileName.js',

output: {

file: process.env.OUTPUT_FILE || `fileName.min.js`,

format: 'es'

}

压缩js,需要再安装plugin下的terser插件

webpack自带压缩功能，Rollup需要单独配置压缩插件

const terser = require('@rollup/plugin-terser'); // 导入加压插件