Babel 编译过程中出现的 Error: Cannot find module 'core-js/library/fn/object/assign' 错误的解决方法

最近在使用 Babel 进行前端项目的编译时，遇到了一个错误：Cannot find module 'core-js/library/fn/object/assign'。这个错误表示在编译过程中找不到这个模块，导致编译失败。本文将介绍这个错误的原因和解决方法。

问题原因

在使用 Babel 进行编译时，通常需要使用一些 polyfill 来兼容一些新的 JavaScript 特性或 API。polyfill 可以填补原生实现中缺少的功能，使得代码可以在更多的浏览器上运行。

Babel 默认使用 core-js 来提供一些常用的 polyfill。在安装了 Babel 和 core-js 后，可以在 Babel 的配置文件 .babelrc 中配置需要的 polyfill：

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "useBuiltIns": "usage"
      }
    ]
  ]
}

其中 "useBuiltIns": "usage" 表示根据代码中使用到的特性，自动引入对应的 polyfill。

问题出在这个自动引入的过程中：当代码中使用了 ES6 的 Object.assign 方法时，Babel 会自动引入下面这个 polyfill：

require('core-js/library/fn/object/assign');

但是，如果项目中并没有安装这个 polyfill，就会出现上述错误。

解决方法

解决这个问题的方法是安装缺少的 polyfill。

有两种方法可以安装缺失的 polyfill。

方法一：手动安装

手动安装 polyfill 的方法比较麻烦，需要在项目中安装对应的 npm 包，并将其引入到代码中。

在本例中，需要手动安装 core-js 这个包，并在代码中引入 core-js/library/fn/object/assign：

npm install core-js

require('core-js/library/fn/object/assign');

这样就可以解决这个错误了。

方法二：自动安装

更为简便的方法是使用 Babel 的 transform-runtime 插件自动安装缺失的 polyfill。

transform-runtime 插件会将代码中使用到的 ES6+ 新特性转换为对应的 polyfill，并将 polyfill 引入代码中。

首先需要安装 @babel/runtime 依赖：

npm install --save-dev @babel/runtime

然后在 .babelrc 配置文件中添加 transform-runtime 插件：

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "useBuiltIns": "usage"
      }
    ]
  ],
  "plugins": ["@babel/transform-runtime"]
}

接下来，在代码中使用 ES6+ 特性时，就不需要手动引入 polyfill 了：

const obj = { a: 1 };
const newObj = Object.assign({}, obj);
console.log(newObj); // { a: 1 }

transform-runtime 会将 Object.assign 转换为 require("@babel/runtime-corejs2/core-js/object/assign")，并引入相应的 polyfill。

总结

本文介绍了在 Babel 编译过程中出现 Cannot find module 'core-js/library/fn/object/assign' 错误的原因和解决方法，提供了手动安装和自动安装两种方法，并给出了示例代码。在使用 Babel 进行编译时，正确的使用 polyfill 是非常重要的，能够兼容更多的浏览器，提升代码的质量和可用性。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65b602bfadd4f0e0ffeb98dd