vue3 遇到babel问题（exports is not defined） 解决方案

由于我在引用ant-design-vue插件，于是产生了下图的问题。

1.问题分析

        Babel 是一个 JavaScript 编译器，主要用于：将 ES6+ 代码转译为 ES5 代码，以兼容旧版浏览器。处理模块化语法（如 import/export）。

2.解决方案

原先的babel.config.js文件如下

module.exports = {
  presets: [
    '@vue/cli-plugin-babel/preset'
  ]
}

修改之后的babel.config.js文件如下

module.exports = {
  presets: [
    [
      '@babel/preset-env',
      {
        targets: {
          browsers: ['> 1%', 'last 2 versions', 'not dead'], // 浏览器兼容范围
        },
        useBuiltIns: 'entry', // 按需引入 polyfill
        corejs: 3, // 使用 core-js 3
      },
    ],
  ],
};

主要这样子配置是为了让Babel自动将现代语法转译为目标浏览器支持的语法，并引入必要的 polyfill。

将corejs导入之后，问题就解决了。

3.参考链接

vue2的解决方案   vue 报错 ReferenceError: exports is not defined - 兔&&大梅 - 博客园