nextjs项目配置babel和polyfill

最近用next写了一个官网页面，谷歌没问题，但是用IE打开后页面一片空白，初步猜测应该是没有配置babel和polyfill，今天就尝试自己配置并学习了一下：
babel中文文档

安装polyfill:

npm install --save @babel/polyfill

在_app.tsx 中引入：

import '@babel/polyfill';

安装babel:

// 处理JSX语言
npm i @babel/core babel-loader @babel/preset-env @babel/preset-react -D

// 处理ES6语言
npm i @babel/plugin-transform-runtime -D
npm i @babel/runtime -S

新建.babelrc， 就好了

{
    "presets": [
        [
          "@babel/env",
          {
            "modules": "commonjs"  
          }
        ]
      ],
      "plugins": [
        "@babel/transform-react-jsx", 
        "@babel/transform-runtime"
      ]
}

next.config.js配置

  rules: [
    {test: /\.(js|jsx)$/, use: 'babel-loader', exclude: /node_modules/},
  ],
  experimental: {
    forceSwcTransforms: true,
  },

参考：
React项目中babel 7的使用
按需引入polyfill