vue3项目中配置eslint
时间: 2024-01-01 11:05:27 浏览: 32
在 Vue3 项目中,配置 ESLint 需要遵循以下步骤:
1. 安装 eslint:在项目根目录下运行以下命令:
```
npm install eslint --save-dev
```
2. 安装 eslint-plugin-vue:这是一个 ESLint 插件,用于检查 Vue 组件代码,运行以下命令进行安装:
```
npm install eslint-plugin-vue --save-dev
```
3. 在项目根目录下创建一个 .eslintrc.js 文件,并添加以下内容:
```javascript
module.exports = {
root: true,
env: {
node: true,
},
extends: [
'plugin:vue/vue3-essential',
'eslint:recommended',
],
parserOptions: {
parser: 'babel-eslint',
},
rules: {
// 在这里添加项目需要的自定义规则
},
};
```
4. 在 package.json 文件中添加一个 lint 命令,以便可以通过运行 npm run lint 来检查代码:
```json
"scripts": {
"lint": "eslint --ext .js,.vue src"
},
```
以上步骤完成后,你就可以使用 ESLint 来检查你的 Vue3 项目中的 JavaScript 和 Vue 组件代码了。在 `.eslintrc.js` 文件中,我们使用了 `plugin:vue/vue3-essential` 来继承 Vue3 的基本规则集,同时也继承了 ESLint 推荐的规则集。你也可以根据项目需要添加自定义规则。