vue-eslint-parser 技术文档

vue-eslint-parser 技术文档

vue-eslint-parser The ESLint custom parser for `.vue` files. 项目地址: https://gitcode.com/gh_mirrors/vu/vue-eslint-parser

1. 安装指南

环境要求

• Node.js 版本：^14.17.0, 16.0.0 或更高版本
• ESLint 版本：6.0.0 或更高版本

安装步骤

1. 打开终端或命令行工具。
2. 运行以下命令安装 vue-eslint-parser：

npm install --save-dev eslint vue-eslint-parser

2. 项目使用说明

配置 ESLint

1. 在项目的根目录下创建或编辑 .eslintrc.* 文件（例如 .eslintrc.json）。
2. 在配置文件中添加 parser 选项，指定使用 vue-eslint-parser。

{
    "extends": "eslint:recommended",
    "parser": "vue-eslint-parser"
}

运行 ESLint

1. 使用 glob 模式或 --ext .vue 选项来指定 .vue 文件。

eslint "src/**/*.{js,vue}"
# 或者
eslint src --ext .vue

3. 项目 API 使用文档

parserOptions

parserOptions 支持与 espree 相同的属性。例如：

{
    "parser": "vue-eslint-parser",
    "parserOptions": {
        "sourceType": "module",
        "ecmaVersion": 2018,
        "ecmaFeatures": {
            "globalReturn": false,
            "impliedStrict": false,
            "jsx": false
        }
    }
}

parserOptions.parser

指定自定义解析器来解析 <script> 标签。例如：

{
    "parser": "vue-eslint-parser",
    "parserOptions": {
        "parser": "@babel/eslint-parser",
        "sourceType": "module"
    }
}

parserOptions.vueFeatures

指定如何解析与 Vue 特性相关的内容。例如：

{
    "parser": "vue-eslint-parser",
    "parserOptions": {
        "vueFeatures": {
            "filter": true,
            "interpolationAsNonHTML": true,
            "styleCSSVariableInjection": true,
            "customMacros": []
        }
    }
}

parserOptions.templateTokenizer

指定自定义的模板解析器。例如：

{
    "parser": "vue-eslint-parser",
    "parserOptions": {
        "templateTokenizer": {
            "pug": "vue-eslint-parser-template-tokenizer-pug"
        }
    }
}

4. 项目安装方式

使用 npm 安装

npm install --save-dev eslint vue-eslint-parser

配置文件示例

{
    "extends": "eslint:recommended",
    "parser": "vue-eslint-parser",
    "parserOptions": {
        "sourceType": "module",
        "ecmaVersion": 2018
    }
}

运行命令

eslint "src/**/*.{js,vue}"
# 或者
eslint src --ext .vue

通过以上步骤，您可以成功安装并配置 vue-eslint-parser，开始对 Vue 文件进行 ESLint 检查。

vue-eslint-parser The ESLint custom parser for `.vue` files. 项目地址: https://gitcode.com/gh_mirrors/vu/vue-eslint-parser