vue3：20、Eslint配合Prettier完成代码风格配置

有蝉

已于 2023-09-08 09:46:29 修改

阅读量504

点赞数

分类专栏： vue3 文章标签： vue.js javascript ecmascript

于 2023-09-08 09:10:01 首次发布

本文链接：https://blog.csdn.net/qq_37899792/article/details/132752647

版权

vue3 专栏收录该内容

34 篇文章 0 订阅

订阅专栏

.eslintrc.cjs

/* eslint-env node */
require('@rushstack/eslint-patch/modern-module-resolution')

module.exports = {
  root: true,
  extends: [
    'plugin:vue/vue3-essential',
    'eslint:recommended',
    '@vue/eslint-config-prettier/skip-formatting'
  ],
  parserOptions: {
    ecmaVersion: 'latest'
  },
  rules: {
    /**关注代码美观度 */
    //需要禁用vscode插件： perttier 以及 format on save
    'prettier/prettier': [
      'warn',
      {
        singleQuote: true, //单引号
        semi: false, //无分号
        printWidth: 80, //每行至多80个字符
        trailingComma: 'none', //不加 对象、数字 最后逗号
        endOfLine: 'auto' //换行符号不限制
      }
    ],
    /**Eslint关注规范 */
    'vue/multi-word-component-names': [
      'warn',
      {
        ignores: ['index'] //vue组件名称多单词组成 忽略index.vue
      }
    ],
    'vue/no-setup-props-destructure': ['off'], //关闭props解构的校验（props解构丢失响应式）
    'no-undef': 'error' //添加未定义变量错误提示  off
  }
}