webpack 打包

Question

开发环境编译没问题，但是生产环境（npm run build） 报错如下，不知道是哪个loader没配置？

Answer 1

@babel/plugin-syntax-dynamic-import

import() 需要用这个编译

Answer 2

如果@babel/plugin-syntax-dynamic-import这个插件装完还是有问题，很可能是踩到了npm的bug了。

这是webpack@4.29.0开始出现的一个问题。webpack内使用acorn作为语法解析器，所以webpack在进行模块代码分析时，涉及到dynamic import时需要acorn-dynamic-import，acorn-dynamic-import把acorn作为peerDependency，而npm在安装这个peerDependency（acorn）时放到了node_modules中不合适的位置。

解决方法

npm update acorn --depth 20
npm dedupe

具体可以参考这个 issue：Parsing of import() fails in 4.29.0 (Compilation issue, related to dynamic import)