Vue项目中eslint与prettier一起用导致的一个bug "error Delete `⏎` prettier/prettier" in .vue files

在vue中一起使用eslint与prettier,可能会有如下报错:

error Delete `⏎` prettier/prettier

原因可以参照github的这个回复,可以按照这个回复的说法去做,也可以升级到最新的eslint-plugin-vue替换原来的插件。具体做法可以参照eslint-plugin-vue 5.x 的README.md 。我整理了下大概的步骤如下:

  1. 移除原来的eslint-plugin-vue以及eslint-plugin-html

    yarn remove eslint-plugin-vue eslint-plugin-html
    
  2. 修改eslint配置
    在你的eslint配置文件,例如.eslintrc.js中,加入extendsplugin:vue/essential,并且移除掉plugins中的html

    module.exports = {
    extends: [
     // add more generic rulesets here, such as:
     // 'eslint:recommended',
     'plugin:vue/essential'
    ],
    plugins: ['vue'],
    rules: {
     // override/add rules settings here, such as:
     // 'vue/no-unused-vars': 'error'
    }
    }
    
  3. 如果使用了其他parser请修改如下:移动parser字段内容到parserOptions

    parserOptions: {
    parser: 'babel-eslint',
    }
    
  4. Enjoy it :)

发表评论: