vscode中使用eslint+prettier的配置

eslint+prettier+vscode自动保存用起来感觉非常爽快。

一般来说,安装eslint+prettier插件,然后使用相关脚手架配套的eslint+prettier,无法自动格式代码,每次都需要执行格式化命令。这里贴出保存自动格式化代码的setting.json。

javascript 复制代码
// ...其他配置项

// eslint配置开始
// eslint检测开关
"eslint.enable": true,
// 需要eslint校验的文件
"eslint.validate": {
	"javascript",
	"javascriptreact",
	"typescript",
	"typescriptreact",
	"vue",
}
"editor.codeActionsOnSave": { // 编辑器.代码保存时动作
	"source.fixAll.eslint": true // 使用eslint修复所有
}

如果不使用脚手架自带的eslint+prettier配置,可以参考我之前写的项目构建之代码检测

这里归纳一下三个安装命令。

  1. 全局安装eslint
powershell 复制代码
npm i eslint -g
  1. eslint初始化
powershell 复制代码
npx eslint --init
  1. 安装prettier、以及相关的eslint插件和配置项
powershell 复制代码
npm i prettier eslint-plugin-prettier eslint-config-pretter -D
相关推荐
山峰哥1 天前
吃透 SQL 优化:告别慢查询,解锁数据库高性能
服务器·数据库·sql·oracle·性能优化·编辑器
Diligently_1 天前
idea 中vm option 配置
java·ide·intellij-idea
holeer1 天前
【V1.0】Typora 中的 HTML 支持|软件文档自翻译
前端·编辑器·html·typora·web·markdown·文档
我命由我123451 天前
在 Android Studio 中,新建 AIDL 文件按钮是灰色
android·ide·android studio·安卓·android jetpack·android-studio·android runtime
硬汉嵌入式1 天前
Vim 9.2版本正式发布
编辑器·vim
Hello World . .1 天前
Linux:线程间通信
linux·开发语言·vscode
AC赳赳老秦1 天前
云原生AI故障排查新趋势:利用DeepSeek实现高效定位部署报错与性能瓶颈
ide·人工智能·python·云原生·prometheus·ai-native·deepseek
被制作时长两年半的个人练习生1 天前
claude code for vscode 配置 qwen3.5
ide·vscode·claude code·qwen3.5
圣心1 天前
Visual Studio Code 中的 AI 智能操作
ide·人工智能·vscode
吹牛不交税1 天前
关于vscode左侧资源管理器目录层级疑似异常的问题
ide·vscode·编辑器