起因： 拉旧项目重跑发现运行报错，猜测是包更新导致部分写法不兼容。之后发现是原写法在webpack4中不兼容。所以这篇文章主要讲两部分：
-
如何解决webpack4 动态编译import报错
-
imoort 和 require到底有什么区别？两者是否可以无缝替换？
1 解决报错
2 require/import的关系和区别？
1. require/exports 和 import/export出现顺序
先有require/exports 才有 import/export ； import / export 其实是个弟弟，最后都会被babel编译为 require / exports
2.为啥 export 是不厉害，它不是 ES6 支持的规范吗？
答：出生背景不同。 require在2010年左右诞生，CommonJS 中大量引用了 require， 而 CommonJS又是node.js的规范。而import作为ES6的规范，大概在14.15年才被大家熟知。 同时babel会将import编译成 require（为了能够引用npm包）所以，import当然不能完全替换require，因为所有import，最后都会被转化成require。至少在CommonJS依旧作为node.js规范的今天是不可以的。
3.为什么我们经常使用import，而不经常使用require?
答：
1. import只是请求模块中需要的部分， require是整包加载。相比之下import性能更好一点，节约了内存
2. import是异步加载，require同步加载。也就是说如果你同时有多个包需要require，则他们需依次执行。
3. import语法更紧凑/更具声明性，基本消除了 CommonJS 与AMD的裂痕（源自stackoverflow，参考一下就好，个人觉得掌握1.2点即可）
4. import是静态加载，require是动态加载。（这里只是列出二者的区别，不去讨论动/静态加载的优缺点）
5. import是 read-only
4. 补充区别： import 是强绑定，require是浅复制，仅仅是普通的值传递。
具体让我们看例子：
转载：https://blog.csdn.net/qq_31915745/article/details/107713759