首页 > 解决方案 > 强制 Babel 将 import 转换为 require?

问题描述

在我从节点 12 升级到节点 14 后,Babel 停止转换importrequire. 这是我的 Babel 配置:

export default {
  presets: [
    ['@babel/preset-env', {
      useBuiltIns: 'usage',
      corejs: '3',
      modules: false,
      targets: {
        node: 12,
      },
    }],
    '@babel/preset-typescript',
  ],
  plugins: [
    '@babel/plugin-syntax-dynamic-import',
    '@babel/plugin-proposal-class-properties',
    '@babel/plugin-proposal-optional-chaining',
  ],
  sourceType: 'unambiguous',
  overrides: [
    {
      test: ['./web'],
      presets: [
        ['@babel/preset-env', {
          useBuiltIns: 'usage',
          corejs: '3',
        }],
      ],
      plugins: [
        '@babel/plugin-transform-react-jsx',
        ['module-resolver', {
          root: ['./shared', './web'],
          extensions: ['.js', '.jsx', '.ts', '.tsx'],
        }],
      ],
      env: {
        production: {
          plugins: ['transform-react-remove-prop-types'],
        },
      },
    },
    {
      test: ['./server'],
      plugins: [
        ['module-resolver', {
          root: ['./shared', './server'],
          extensions: ['.js', '.jsx', '.ts', '.tsx'],
        }],
      ],
    },
    {
      test: ['./shared'],
      plugins: [
        ['module-resolver', {
          root: ['./shared'],
          extensions: ['.js', '.jsx', '.ts', '.tsx'],
        }],
      ],
    },
  ],
};

我怎样才能让 Babel 变形import

标签: javascriptbabeljs

解决方案


您应该将@babel/preset-env'modules选项设置为,'cjs'以便它将您的模块转换为 CommonJS(它使用require)。值false告诉 Babel 不要执行模块转换。

Babel 的文档

“AMD” | “嗯” | “系统” | “普通” | "cjs" | “汽车” | 假,默认为“自动”。

启用将 ES 模块语法转换为另一种模块类型。请注意,cjs 只是 commonjs 的别名。

将此设置为 false 将保留 ES 模块。仅当您打算将本机 ES 模块发送到浏览器时才使用此选项。如果你使用 Babel 打包器,默认模块:“auto”总是首选。


推荐阅读