@uxd.wenge/eslint-config-wg

eslint-config-wg

此规则适用于 JavaScript/Vue 项目的 ESLint 配置规范。

目前已支持 Vue 3.0，需要指定 extends 配置vue3

安装依赖

• eslint： JavaScript 和 JSX 检查工具
• @babel/eslint-parser： 使 eslint 支持有效的 babel 代码
• vue-eslint-parser： .vue文件的 ESLint 自定义解析器
• eslint-plugin-vue： 使用 ESLint 检查 .vue文件 的 template 和 script
• @uxd.wenge/eslint-config-wg： 内部的 ESLint 配置规范
• eslint-plugin-prettier： 基于 prettier 代码风格的 eslint 规则
• eslint-config-prettier： 禁用所有与格式相关的 eslint 规则，解决 prettier 与 eslint 规则冲突，确保将其放在 extends 队列最后，这样它将覆盖其他配置

依赖版本

eslint ^7.32.0
@babel/eslint-parser ^7.15.0
vue-eslint-parser ^7.10.0
eslint-plugin-vue ^7.16.0
eslint-plugin-prettier ^3.4.1
eslint-config-prettier ^8.3.0

使用方法

Vue

npm install --save-dev eslint @babel/eslint-parser vue-eslint-parser eslint-plugin-vue  eslint-plugin-prettier eslint-config-prettier @uxd.wenge/eslint-config-wg@latest

在你的项目的根目录下创建一个 .eslintrc.js 文件，并将以下内容复制进去：

module.exports = {
    extends: [
        '@uxd.wenge/wg',
        // 这里是针对 vue2 的配置
        '@uxd.wenge/wg/vue', 
        // 如果是 vue3 的项目工程，则推荐下面配置
        // '@uxd.wenge/wg/vue3',
    ],
    env: {
        // 你的环境变量（包含多个预定义的全局变量）
        //
        // browser: true,
        // node: true,
        // mocha: true,
        // jest: true,
        // jquery: true
    },
    globals: {
        // 你的全局变量（设置为 false 表示它不允许被重新赋值）
        //
        // myGlobal: false
    },
    rules: {
        // 自定义你的规则
    }
};

• 项目目录下的 package.json 添加检测指令，举个例子

{
 ...
 "scripts": {
+    "lint:es": "eslint \"src/**/*.{vue,js,jsx}\" --fix",
 }
 ...
}

Vue3 新增规则