解析器“babylon”已经弃用错误 - webpack构建

7

我升级了项目的JS包之后,在使用Webpack打包时出现了一个错误。该错误似乎在构建.vue文件时出现,并且可能会在任何.vue文件构建中出现。我的package.json中没有“babylon”,并且我拥有更新的@babel/core版本(7.2.2)。

以下是错误信息:

{ parser: "babylon" } is deprecated; we now treat it as { parser: "babel" }

它似乎只在构建.vue文件时出现。

这是我的配置:

.babelrc

{
  "presets": ["@babel/preset-env"],
  "plugins": ["@babel/plugin-transform-regenerator"]
}

Webpack 配置:

module: {
rules: [
  {
    enforce: 'pre',
    test: /\.(js|vue)$/,
    loader: 'eslint-loader',
    exclude: /node_modules/
  },
  {
    test: /\.vue$/,
    loader: 'vue-loader',
    options: {
      loaders: {
        scss: 'vue-style-loader!css-loader!sass-loader',
        sass: 'vue-style-loader!css-loader!sass-loader?indentedSyntax'
      }
    }
  },
  {
    test: /\.js$/,
    exclude: /node_modules/,
    use: [ 'babel-loader' ]
  },
  {
    test: /\.sass$/,
    exclude: /node_modules/,
    use: ExtractTextPlugin.extract({
      fallback: 'style-loader',
      use: [
        {
          loader: 'css-loader',
          options: {
            sourceMap: true
          }
        },
        {
          loader: 'postcss-loader',
          options: {
            sourceMap: true
          }
        },
        {
          loader: 'sass-loader',
          options: {
            sourceMap: true
          }
        }
      ]
    })
  }
]

}

.eslintrc.js

  extends: [
'eslint:recommended',
'plugin:vue/recommended',
'plugin:import/errors',
'plugin:import/warnings'
],
 settings: {
'import/resolver': {
  'node': {
    'extensions': [
      '.js',
      '.vue'
    ]
  }
 }
 },
  parserOptions: {
  parser: 'babel-eslint',
  ecmaVersion: 2018
 }

package.json

"dependencies": {
    "@fortawesome/fontawesome-free": "^5.1.0",
    "@fortawesome/fontawesome-svg-core": "^1.2.10",
    "@fortawesome/free-solid-svg-icons": "^5.6.1",
    "@fortawesome/vue-fontawesome": "^0.1.3",
    "autoprefixer": "^9.4.6",
    "axios": "^0.18.0",
    "babel-eslint": "^10.0.1",
    "babel-polyfill": "^6.23.0",
    "backbone": "^1.3.3",
    "bulma": "^0.7.1",
    "bulma-calendar": "^5.0.3",
    "clean-webpack-plugin": "^1.0.1",
    "css-loader": "^0.28.4",
    "extract-text-webpack-plugin": "^3.0.0",
    "flickity": "^2.0.9",
    "flickity-imagesloaded": "^2.0.0",
    "friendly-errors-webpack-plugin": "^1.6.1",
    "glob-all": "^3.1.0",
    "in-view": "^0.6.1",
    "jquery": "^3.2.1",
    "js-cookie": "^2.2.0",
    "lazysizes": "^4.0.2",
    "magnific-popup": "^1.1.0",
    "node-pre-gyp": "^0.12.0",
    "node-sass": "^4.7.2",
    "optimize-css-assets-webpack-plugin": "^3.0.0",
    "postcss-loader": "^3.0.0",
    "purify-css": "^1.2.5",
    "purifycss-webpack": "^0.7.0",
    "sass-loader": "^6.0.7",
    "style-loader": "^0.18.2",
    "underscore": "^1.8.3",
    "vue": "2.5.22",
    "vue-affix": "^0.2.4",
    "vue-lazyload": "^1.2.6",
    "vue-loader": "13.7.2",
    "vue-template-compiler": "2.5.22",
    "vuex": "^3.0.1",
    "webpack": "^3.4.1",
    "webpack-bundle-analyzer": "^2.8.3",
    "webpack-bundle-tracker": "^0.2.0",
    "webpack-dev-server": "^2.6.1",
    "webpack-merge": "^4.1.0"
},
"devDependencies": {
    "@babel/core": "^7.2.2",
    "@babel/plugin-transform-regenerator": "^7.0.0",
    "@babel/preset-env": "^7.3.1",
    "babel-loader": "^8.0.5",
    "eslint": "^4.14.0",
    "eslint-loader": "^2.1.1",
    "eslint-plugin-import": "^2.14.0",
    "eslint-plugin-vue": "4.7.1"
}

使用这个指南 迁移到 vue-loader v15.x.x 帮助我解决了'babylon deprecated'问题。 - Lana
3个回答

10

这个问题来自于vue-loader 13.x.x和14.x.x版本。

15.x.x版本似乎没问题,但我无法将我的项目升级到15.x.x版本,否则会导致一切崩溃。(我猜你也会遇到同样的问题)

我会在项目存储库中记录一个问题,并希望他们能发布一个修复程序。

编辑:

暂时,您可以使用我创建的14.2.2的分支版本来摆脱这个消息。不确定它是否与您的构建兼容。

尝试替换:

"vue-loader": "13.7.2",

使用

"vue-loader": "https://github.com/graux/vue-loader#a0d6b77",

我的项目中没有vue-loader。但是出现了相同的问题。怎么回事? - Kid

0

-1
或者只需将 vue-loader": "^11.0.0 添加到您的 package.json 中即可完成任务。

为什么你想从(在我的情况下)15降级到11? - Grandizer
它是11及以上版本。因此它不会降级 @Grandizer - Panda2109

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接