当出现这种BUG时,先冷静下。

ERROR in ./node_modules/webpack - dev- server /client/utils/stripAnsi.js 1:0-43
Module not found: Error: Can't resolve ' core -js/modules/es. error .cause.js' in ' D: \mylife- mylearn\Vue- demo\bi1l- app\node_ modules \webpack -
webpack compiled with 9 errors

1.  首先查看你是否安装了polyfill.

 npm i @babel/polyfill --save

2. 然后你得查看你配置core-js版本和polyfill版本是否匹配.

  2.1 如果不是,那就需要统一polyfill和core-js的版本

npm i @core-js --save
npm i @babel/polyfill --save

什么是polyfill?


在webpack中进行polyfill 的设置,从而去处理Js 的兼容性

  • 在webpack4 不太需要处理polyfill, 因为默认情况已经将polyfill加进去了,正是因为这个,所以让我们的打包之后的产出内容会特别的大.
  •  在webpack5 就已经移出了polyfill了,那你想用就得安装并配置了 polyfill.
  •  我期望在打包过后,对着promise 这些类做一个,类的声明,ie一些老的版本可以进行兼容。其中我们babel也有preset-env 但是这个预设,他能转换的语法非常的有限
  •   当遇到Symbol Generator 这些更新的语法的时候呢,我们会发现preset-env 并不能够进行转换,为了解决这个问题。
  •  polyfill就派上用场了。

使用polyfill


 npm i @babel/polyfill 按照规则来说应该后面加的是--save;  -D也能去使用.
 当你安装后,它会有几个warn 你可参考这个网站 https://babeljs.io/docs/en/babel-polyfill

  1.  polyfill
  2. 按需配置
  3. @babel-polyfill   --> core-js  regenerator-runtime

 所以我们真正要安装的是

npm i core-js   regenerator-runtime

好了,这次分享就结束了!

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐