目标是:Eslint校验代码语法,prettier统一格式化代码,按下保存自动修复eslint错误,自动格式化代码(因为懒~) 安装vscode插件 首先,需要安装Vetur、ESLint、Prettier - Code formatter这三个插件,安装完重启下,防止插件不生效。 另外这里有个坑,Beautify插件会占用格式化代码的快捷键,因此会和prettier产生冲突,所以直接禁用掉。
2. 安装 eslint 以及 prettier 以及一堆依赖 pnpm i eslint eslint-plugin-vue @vue/eslint-config-prettier prettier eslint-plugin-prettier eslint-config-prettier eslint-plugin-import -D 3. 安装 TS 依赖 pnpm i @typescript-eslint/parser @typescript-eslint/eslint-plugin -D 4. 初始化 eslint ...
"devDependencies": {"@typescript-eslint/eslint-plugin": "^5.8.0","@typescript-eslint/parser": "^5.8.0","eslint": "^8.5.0","eslint-config-prettier": "^8.3.0","eslint-plugin-prettier": "^4.0.0","eslint-plugin-vue": "^8.2.0","husky": "^7.0.4","lint-staged": "^12.1...
另外,你也可以通过在npmjs.com上搜索“eslint-config”并使用别人创建的配置。在没有使用别人的可共享配置或在配置中明确启用规则时,ESLint 不会检查你的代码。 二、配置 prettier 在我们的项目中,eslint 应主要负责校验语法校验,prettier应主要负责代码格式化。同eslint一样,我们不需要单独安装 ESLint 去使用,例如...
结合ESLint和Prettier的一种方式是将Prettier作为ESLint插件使用,下面介绍下如何安装配置。 1. 安装 要使用ESLint和Prettier当然先得安装他们啦,然后还需要安装eslint-plugin-prettier。 为了防止Prettier和ESLint格式化功能冲突,还需要安装eslint-config-prettier来关闭ESLint中的代码格式化功能 ...
Eslint是一个代码检查工具,用来检查你的代码语法是否符合指定的规范,ECMAScript标准 二、prettier插件——代码格式化工具 prettier是一款优秀的代码格式化工具,它并不关心你的语法是否正确,只关心你的代码格式,比如是否使用单引号,语句结尾是否使用分号等等,它可以把格式错乱的代码转化为符合标准的漂亮代码,prettier支持格式化...
配置prettier 集成到 eslint 中 此处也可以结合文档进行配置:https://github.com/prettier/eslint-plugin-prettier 安装完成后,需要让 eslint 集成 prettier 的这些规则,让 eslint 可以提示给开发者 prettier 的不规范代码,在.eslintrc.cjs中添加如下内容: ...
ESLint 的主要功能包含代码格式和代码质量的校验,而 Prettier 只是代码格式的校验,不会对代码质量进行校验。 代码格式问题:单行代码长度、tab 长度、空格、逗号表达式,尾部使用分号,空语句块等问题。 代码质量问题:未使用变量、三等号、全局变量声明,v-for会自动追加key值,多单词驼峰来进行组件命名等问题。
2.eslint 配置 2.1 代码规范 本项目基本规范是依托于 vue 官方的eslint-plugin-vue。并使用 Prettier 格式化代码,使样式与规则保持一致。 .eslintrc.js 配置如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
.prettierrc.js自己写, 根据公司提供的eslintrc module.exports= {root:true,env: {node:true},//"eslint:recommended" 来启用推荐的规则extends: ['plugin:vue/essential','eslint:recommended','@vue/prettier'],parserOptions: {parser:'babel-eslint'},rules: {'no-console': process.env.NODE_ENV==...