webpack & babel-polyfill：无法解析源目录中的“core-js/modules/es6.array.map”答案

【问题标题】：webpack & babel-polyfill: Can't resolve 'core-js/modules/es6.array.map' in source directorywebpack & babel-polyfill：无法解析源目录中的“core-js/modules/es6.array.map”
【发布时间】：2019-07-19 00:49:49
【问题描述】：

我在执行webpack 时遇到此错误：

Module not found: Error: Can't resolve 'core-js/modules/es6.array.map' in '/path/to/project/src'
 @ ./src/index.ts 1:0-39

index.ts:

console.log([1, 2, 3].map(x => x * x));

.babelrc:

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

webpack.config.js:

const path = require('path');

module.exports = {
  mode: 'development',

  entry: './src/index.ts',
  devtool: false,
  output: {
    filename: 'bundle.js',
    path: path.join(__dirname, 'dist')
  },
  module: {
    rules: [
      {
        test: /\.ts$/,
        use: [
          { loader: 'babel-loader' },
          { loader: 'ts-loader' }
        ]
      }
    ]
  },
  resolve: {
    extensions: [
      '.ts'
    ]
  }
};

我认为错误是试图解析src/中的模块，而不是node_modules/，这很奇怪。

我尝试删除node_modules 和package.json，然后删除npm i，但并没有改变这种情况。

我还尝试了另一种使用@babel/polyfill 描述here 的方式。

将useBuiltIns 设置为'entry' 只会增加类似错误的数量。将其设置为 false 会导致不同的错误。

Module not found: Error: Can't resolve 'core-js/es6' in '/path/to/project/node_modules/@babel/polyfill/lib'
 @ ./node_modules/@babel/polyfill/lib/index.js 3:0-22
 @ multi @babel/polyfill ./src/index.ts

ERROR in ./node_modules/@babel/polyfill/lib/index.js
Module not found: Error: Can't resolve 'regenerator-runtime/runtime' in '/path/to/project/node_modules/@babel/polyfill/lib'
 @ ./node_modules/@babel/polyfill/lib/index.js 23:0-38
 @ multi @babel/polyfill ./src/index.ts

看来core-js和regenerator-runtime应该安装在node_modules/@babel/polyfill/中。目前目录中只有index.js和noConflict.js。我是否必须在此目录中手动安装这些模块？

【问题讨论】：

你包含了@babel/polyfill 吗？
不，因为当 useBuiltIns 为 'usage' 时，@babel/polyfill 不应包含在源代码中 (babeljs.io/docs/en/babel-polyfill)
你为什么使用 ts-loader？从 v7 开始，babel 已经内置了对 TS 的支持。您是否尝试安装文档说您可能需要的 core-js - babeljs.io/docs/en/babel-preset-env#usebuiltins？
我将 node_module/core-js 符号链接到 node_modules/@babel/polyfill/lib/core-js 和 src/core-js 并且它似乎可以访问，但错误仍然存在。

标签： javascript node.js typescript webpack babel-polyfill

【解决方案1】：

尝试在您的resolves 中添加以下内容 -

  resolve: {
    extensions: [
      '.ts',
      '.js' // add this
    ]
  }

【讨论】：