将“proposal-object-rest-spread”插件添加到 babel.config.js 以修复 Microsoft Edge 错误 SCRIPT1028

Question

编辑：这个问题似乎已通过 Microsoft Edge Chromium 的新测试版得到修复。 （2020 年 1 月 18 日）

我需要将此Babel plugin 添加到 babel.config.js 以摆脱 Microsoft Edge 浏览器错误

SCRIPT1028：预期的标识符、字符串或数字

我安装了最新的包并将它们添加到 package.json。 以下是我尝试过的，但在运行 npm run build 后它并没有转换代码：

babel.config.js

require("@babel/core").transform("code", {});

module.exports = {
  presets: ["@vue/app"],
  plugins: ["@babel/plugin-proposal-object-rest-spread"]
};

package.json

{
  "name": "example",
  "version": "0.2.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "@babel/polyfill": "^7.6.0",
    "core-js": "^2.6.5",
    "date-fns": "^2.4.1",
    "firebase": "^7.0.0",
    "lodash": "^4.17.15",
    "register-service-worker": "^1.6.2",
    "vue": "^2.6.10",
    "vue-flickity": "^1.2.1",
    "vue-router": "^3.0.3",
    "vuetify": "^2.0.0",
    "vuex": "^3.0.1"
  },
  "devDependencies": {
    "@babel/cli": "^7.6.4",
    "@babel/core": "^7.6.4",
    "@babel/plugin-proposal-object-rest-spread": "^7.6.2",
    "@babel/preset-env": "^7.6.3",
    "@vue/cli-plugin-babel": "^3.11.0",
    "@vue/cli-plugin-eslint": "^3.11.0",
    "@vue/cli-plugin-pwa": "^3.11.0",
    "@vue/cli-service": "^3.11.0",
    "@vue/eslint-config-prettier": "^5.0.0",
    "babel-eslint": "^10.0.1",
    "eslint": "^5.16.0",
    "eslint-plugin-prettier": "^3.1.0",
    "eslint-plugin-vue": "^5.0.0",
    "material-design-icons-iconfont": "^5.0.1",
    "prettier": "^1.18.2",
    "sass": "^1.17.4",
    "sass-loader": "^7.1.0",
    "stylus": "^0.54.5",
    "stylus-loader": "^3.0.2",
    "terser-webpack-plugin": "^2.1.2",
    "uglifyjs-webpack-plugin": "^2.2.0",
    "vue-cli-plugin-vuetify": "^0.6.3",
    "vue-template-compiler": "^2.6.10",
    "vuetify-loader": "^1.2.2"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "@vue/prettier"
    ],
    "rules": {},
    "parserOptions": {
      "parser": "babel-eslint"
    }
  },
  "postcss": {
    "plugins": {
      "autoprefixer": {}
    }
  },
  "browserslist": [
    "> 1%",
    "last 2 versions"
  ]
}

如何设置 Babel 插件以正确转换代码？

编辑：错误截图 - EDGE INSIDER 18 指向这段代码：

Answer 1

由于我无法尝试您要检查的代码，我建议使用库配置中提到的以下 babel 配置：

  plugins: [["@babel/plugin-proposal-object-rest-spread", { "loose": true, "useBuiltIns": true }]]

Answer 2

babel.config.js 应该导出一个function 并且应该位于项目的根目录中。

你的配置应该和这个类似?

module.exports = function(api) {
    api.cache(true);

    const presets = ['@vue/app'];
    const plugins = ['@babel/plugin-proposal-object-rest-spread'];
    // Or try this
    // const plugins = [['@babel/plugin-proposal-object-rest-spread', { loose: true, useBuiltIns: true }]];

    return {
        presets,
        plugins,
    };
};