由于“未找到模块：错误：无法解决”错误，网页包突然无法编译

Question

截至昨天下午，我们的Javascript单元测试套件已经开始失败。在出现一系列“未找到模块”错误后，所有测试均未运行，webpack报告生成失败。这是我们的构建堆栈：

节点6.11.5（是的，我知道，非常古老）业力1.7.1 Webpack 2.2.1 React 15.6.2

我们使用Karma运行单元测试。大多数测试套件都涉及React，所以我们使用Webpack来构建一切。为此，我们导入我们的网页包配置，然后将各种值插入Karma网页包配置。

直接使用Webpack构建脚本效果很好，但是当我们尝试运行karma start时，我们会遇到很多这样的错误：

ERROR in ./~/object.entries/implementation.js
Module not found: Error: Can't resolve 'es-abstract/2019/RequireObjectCoercible' in '/jenkins/workspace/RFD/DCS/assets-build/build-js/node_modules/object.entries'
 @ ./~/object.entries/implementation.js 3:29-79
 @ ./~/object.entries/index.js
 @ ./~/enzyme/build/Utils.js
 @ ./~/enzyme/build/ReactWrapper.js
 @ ./~/enzyme/build/index.js
 @ ../sources/admin/js/pages/sponsored/organic_flyers/tests/DealerAddButton.spec.jsx

ERROR in ./~/object.fromentries/implementation.js
Module not found: Error: Can't resolve 'es-abstract/2019/AddEntriesFromIterable' in '/jenkins/workspace/RFD/DCS/assets-build/build-js/node_modules/object.fromentries'
 @ ./~/object.fromentries/implementation.js 3:29-79
 @ ./~/object.fromentries/index.js
 @ ./~/enzyme-adapter-utils/build/Utils.js
 @ ./~/enzyme-adapter-utils/build/index.js
 @ ./~/enzyme-adapter-react-15/build/ReactFifteenAdapter.js
 @ ./~/enzyme-adapter-react-15/build/index.js
 @ ../sources/admin/js/pages/sponsored/organic_flyers/tests/DealerAddButton.spec.jsx

ERROR in ./~/object.fromentries/implementation.js
Module not found: Error: Can't resolve 'es-abstract/2019/CreateDataPropertyOrThrow' in '/jenkins/workspace/RFD/DCS/assets-build/build-js/node_modules/object.fromentries'
 @ ./~/object.fromentries/implementation.js 4:32-85
 @ ./~/object.fromentries/index.js
 @ ./~/enzyme-adapter-utils/build/Utils.js
 @ ./~/enzyme-adapter-utils/build/index.js
 @ ./~/enzyme-adapter-react-15/build/ReactFifteenAdapter.js
 @ ./~/enzyme-adapter-react-15/build/index.js
 @ ../sources/admin/js/pages/sponsored/organic_flyers/tests/DealerAddButton.spec.jsx

ERROR in ./~/object.fromentries/implementation.js
Module not found: Error: Can't resolve 'es-abstract/2019/Get' in '/jenkins/workspace/RFD/DCS/assets-build/build-js/node_modules/object.fromentries'
 @ ./~/object.fromentries/implementation.js 5:10-41
 @ ./~/object.fromentries/index.js
 @ ./~/enzyme-adapter-utils/build/Utils.js
 @ ./~/enzyme-adapter-utils/build/index.js
 @ ./~/enzyme-adapter-react-15/build/ReactFifteenAdapter.js
 @ ./~/enzyme-adapter-react-15/build/index.js
 @ ../sources/admin/js/pages/sponsored/organic_flyers/tests/DealerAddButton.spec.jsx

所有这些问题似乎都与es abstract有关，我们注意到它昨天发布了一个新版本（1.17.0-next.1）。这正是一切开始失败的时候。也就是说，该软件包似乎已正确下载和安装：

ubuntu@ip-172-17-108-178:/workspace/assets-build/build-js$ npm list es-abstract
admin@0.0.1 /workspace/assets-build/build-js
├─┬ enzyme@3.10.0
│ ├─┬ array.prototype.flat@1.2.3
│ │ └── es-abstract@1.17.0-next.1
│ ├─┬ object.entries@1.1.1
│ │ └── es-abstract@1.17.0-next.1
│ └─┬ string.prototype.trim@1.2.0
│   └── es-abstract@1.16.3  deduped
├─┬ enzyme-adapter-react-15@1.4.1
│ ├─┬ enzyme-adapter-utils@1.12.1
│ │ ├─┬ airbnb-prop-types@2.15.0
│ │ │ └─┬ array.prototype.find@2.1.0
│ │ │   └── es-abstract@1.16.3  deduped
│ │ └─┬ object.fromentries@2.0.2
│ │   └── es-abstract@1.17.0-next.1
│ └─┬ object.values@1.1.1
│   └── es-abstract@1.17.0-next.1
├─┬ eslint-plugin-jsx-a11y@6.2.3
│ └─┬ array-includes@3.1.0
│   └── es-abstract@1.17.0-next.1
└─┬ object.values@1.0.4
  └── es-abstract@1.16.3

当我手动检查node\u modules目录时，根据对es abstract Github的粗略检查，我可以看到我希望看到的所有文件。我不明白为什么Webpack显然看不到这些文件，尽管它们安装在正确的位置。我也不明白为什么从昨天开始，这会突然中断，除非es抽象包出了问题。但如果是这样，没有人向任何受影响的项目（包括酶和一些ES垫片）或ES抽象项目本身报告任何问题。此外，查看一些受影响项目的CI构建，它们似乎仍然报告通过了测试。

我们无所适从。我尝试过从零开始清除node_模块和npm安装ing，将node升级到v8 LTS，降级Enzyme和React适配器，尝试引入旧版本的es abstract（这不起作用，他们的package.json文件仍然要求^1.17.0-next.1，这对我来说毫无意义，因为其中一些版本已经发布一年了）。没有任何效果。

Answer 1

我在维护者github仓库上创建了一个问题https://github.com/ljharb/es-abstract/issues/84#issuecomment-567422831

由于我们遇到了完全相同的问题，我们提出了一个想法，并在评论中进行了描述。在production标志下运行webpack开发构建。对于我们来说，所有源地图条目都被保留，我们的开发应用程序完全可以调试。所以我们把它作为一个解决办法。

如果这种情况在将来出现，我们可能会将所有与semver范围相关的存储库分叉，并将其托管到我们真正过时的旧式回购中。

Answer 2

这是Webpack或Jest配置的问题。

绝对路径和相对路径都可以使用，但请注意，它们的行为会有所不同。

通过查看当前目录及其祖先目录（即../Node_modules、../Node_modules等），将以类似于Node扫描Node_模块的方式扫描相对路径。

对于绝对路径，它将只在给定的目录中搜索。

webpack.config.js

module.exports = {
  //...
  resolve: {
    modules: ['node_modules']
  }
};

对节点\ U模块使用相对路径

Answer 3

我有这个问题，并解决了我的模块解决方案设置在笑话。

根据当前情况，我的包锁包括：

"array.prototype.find": {
  "version": "2.1.0",
  "resolved": "https://registry.npmjs.org/array.prototype.find/-/array.prototype.find-2.1.0.tgz",
  "integrity": "sha512-Wn41+K1yuO5p7wRZDl7890c3xvv5UBrfVXTVIe28rSQb6LS0fZMDrQB6PAcxQFRFy6vJTLDc3A2+3CjQdzVKRg==",
  "requires": {
    "define-properties": "^1.1.3",
    "es-abstract": "^1.13.0"
  }
},

和

"array-includes": {
  "version": "3.1.0",
  "resolved": "https://registry.npmjs.org/array-includes/-/array-includes-3.1.0.tgz",
  "integrity": "sha512-ONOEQoKrvXPKk7Su92Co0YMqYO32FfqJTzkKU9u2UpIXyYZIzLSvpdg4AwvSw4mSUW0czu6inK+zby6Oj6gDjQ==",
  "dev": true,
  "requires": {
    "define-properties": "^1.1.3",
    "es-abstract": "^1.17.0-next.0"
  },
  "dependencies": {
    "es-abstract": {
      "version": "1.17.0-next.1",
      "resolved": "https://registry.npmjs.org/es-abstract/-/es-abstract-1.17.0-next.1.tgz",

...

这导致我在根节点_模块和1.17.0-next.1中安装了es abstract 1.16.3，作为array includes（以及其他）的子依赖项。

更改了我的JestmoduleDirectory配置后，我的根node_modules第一个查找位置。这就是Jest docs对这个选项的描述：递归搜索的目录名数组，设置这个选项将覆盖默认值，恰好是node_modules。

因此，请检查您的配置此功能：

• https://jestjs.io/docs/en/configuration#moduledirectories-为开玩笑而编剧
• https://webpack.js.org/configuration/resolve/ 用于网页包