调试时禁止在 Vue-CLI 应用程序中转译为 ES5

Question

我有一个开箱即用的 Vue CLI 应用程序，它使用 babel 转换为 ES5。有时这会导致调试时出现问题（因为我通过源映射查看的代码并不完全是运行）。

如何禁用此转译，至少在调试模式下？部分问题是，因为这是刚刚建立的，我真的不明白 webpack、babel 等链的所有步骤是什么，每次我尝试阅读它时，它看起来都很复杂。

我的 package.json 的相关部分是：

  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.3.0",
    "@vue/cli-plugin-eslint": "^3.3.0",
    "@vue/cli-service": "^3.3.0",
    "babel-eslint": "^10.0.1",
    "copy-webpack-plugin": "^4.6.0",
    "eslint": "^5.8.0",
    "eslint-plugin-vue": "^5.0.0",
    "pug": "^2.0.3",
    "pug-plain-loader": "^1.0.0",
    "vue-cli-plugin-pug": "^1.0.7",
    "vue-template-compiler": "^2.5.21",
    "webpack-dev-server": "3.2.0"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "rules": {
      "no-console": 0
    },
    "parserOptions": {
      "parser": "babel-eslint"
    }
  },
  "postcss": {
    "plugins": {
      "autoprefixer": {}
    }
  },
  "browserslist": [
    "> 1%",
    "last 2 versions",
    "not ie <= 8"
  ]

密码是here.

Answer 1

你可以尝试添加

ignore: ["./src"]; // './src' is your desired directory

在您的 babel.config.js 文件中。

If any of the patterns match, Babel will immediately stop all processing of the current build.

有效选项是 Array<MatchPattern>，表示一组模式，了解更多信息 here

在他们的官方 doc

了解更多关于 ignore 的信息

因为你只想在开发模式下忽略这些文件，你需要这样的东西：

ignore: [ process.env.NODE_ENV !== 'production' ? "./src" : "" ],

调试时禁止在 Vue-CLI 应用程序中转译为 ES5

Disable transpiling to ES5 in Vue-CLI app while debugging

javascript

webpack

ecmascript-6

babeljs

vue-cli