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
相关推荐
秋雨雁南飞6 小时前
Visual Studio 常用扩展
ide·visual studio
X1A0RAN10 小时前
解决Pycharm中部分文件或文件夹被隐藏不展示问题
ide·python·pycharm
小e说说13 小时前
主流活动策划工具特点比较
编辑器
winlife_14 小时前
把 Godot 编辑器接入 AI:Funplay MCP for Godot 介绍
人工智能·编辑器·godot·ai编程·游戏开发·mcp
wh_xia_jun14 小时前
用pom 的test 配置 与 jacoco
java·ide·intellij-idea
zhaqonianzhu17 小时前
Qoder CN 插件停更与迁移指南:从 VS Code 到通义灵码 IDE
ide·vscode
数智工坊17 小时前
PyCharm 运行 Python 脚本总自动进 Test 模式?附 RT-DETRv2 依赖缺失终极排坑
开发语言·ide·人工智能·python·pycharm
00后程序员张17 小时前
Windows 下怎么生成 AppStoreInfo.plist?不依赖 Xcode 的方法
ide·macos·ios·小程序·uni-app·iphone·xcode
BU摆烂会噶18 小时前
【LangGraph】House_Agent 实战(一):架构与环境配置
人工智能·vscode·python·架构·langchain·人机交互
IceSugarJJ18 小时前
Windows下VSCode+ WSL项目启动流程
linux·windows·vscode·ubuntu·wsl