代码风格统一之代码自动格式化

智码映溟使
• 阅读 2985

目标

  • 保存时自动格式化
  • 保存时不能自动格式化,使其自动格式化
注意事项
  • 项目是使用 npm 或 yarn
  • 可以自己配置 ESLint 实现代码风格统一

安装 ESLint

安装ESLint

npm i eslint
# or
npm i -S eslint // --save    写入到 dependencies 对象,仅在当前项目安装并使用
# or
npm i -D eslint // --save-dev   写入到 devDependencies 对象,仅在当前项目安装并在 dev 环境使用

配置

ESlint 有两部分需要配置,一部分是项目的配置文件,一部分是 vscode 的配置

配置 vscode 实现保存自动格式化代码风格

在安装好 vscode 的 ESlint 插件后,按 Ctrl + ,打开 vscode 的设置,然后找到扩展点击,找到 ESlint 勾选 Auto Fix On Save
代码风格统一之代码自动格式化

配置 package.js 实现统一格式化代码风格

在配置好上边后,可能会遇到开发同伴没有用 vscode 或者在保存时可能没能自动格式化,这种情况可以在 package.js 中添加一条脚本命令

// 使用 ESlint 修复(--fix) 检查(--ext) 后缀为 .js 的文件 路径是当前目录
"lint": "eslint --fix --ext .js ."

这样只需要在命令行运行 npm run lint 就可以自动格式化代码,有报错的话需要自己手动修复,一般是写错了字符或者逻辑错误
代码风格统一之代码自动格式化

点赞
收藏
评论区
推荐文章
皕杰报表之UUID
​在我们用皕杰报表工具设计填报报表时,如何在新增行里自动增加id呢?能新增整数排序id吗?目前可以在新增行里自动增加id,但只能用uuid函数增加UUID编码,不能新增整数排序id。uuid函数说明:获取一个UUID,可以在填报表中用来创建数据ID语法:uuid()或uuid(sep)参数说明:sep布尔值,生成的uuid中是否包含分隔符'',缺省为
Easter79 Easter79
4年前
Vue 项目中 ESlint 配置
前言对于ESlint这一块一直存在一些疑问,今天看到一个文章内容挺好的,这里拿来了。一、eslint安装1、全局安装npmigeslint全局安装的好处是,在任何项目我们都可以使用eslint的全局命令进行代码规则操作,但是这对我们的意义并不大,后续会详细介绍;全局安装之后
科林-Colin 科林-Colin
4年前
VSCode 插件之 ESLint
vscodeeslintgithub.com/microsoft/v…(https://github.com/microsoft/vscodeeslint)为了区分npmESLint包和VSCode的ESLint插件,我把前者称为npmESLint,后者称为vscodeeslint。vscodeeslint优先
Wesley13 Wesley13
4年前
vscode 使用 clang 格式化 c++代码
原文链接: vscode使用clang格式化c代码(https://my.oschina.net/ahaoboy/blog/4497479)需要ubuntu 安装clangvscode安装clangformat插件和clangd插件sudoaptgetupdatesudoaptg
Wesley13 Wesley13
4年前
vscode中配置eslint
安装Nodejs,然后安装eslint使用全局安装:npminstallgeslintnpminstallg eslintpluginreactnpminstallgeslintpluginhtml安装完毕后,我们使用"eslintinit"命令在用户目录中生成一个配置文件(也可以在任何你喜欢的位
Wesley13 Wesley13
4年前
IDEA快捷键
Alt回车导入包,自动修正CtrlN查找类CtrlShiftN查找文件CtrlAltL格式化代码CtrlAltO优化导入的类和包AltInsert生成代码(如get,set方法,构造函数等)CtrlE或者AltShiftC最近更改的代码CtrlR替换文本CtrlF查找文
流浪剑客 流浪剑客
2年前
go语言集成开发工具:GoLand 2023 for Mac中文版
是一款专门为Go语言开发者打造的集成开发环境(IDE)。它能够提供一系列功能,如代码自动完成、语法高亮、代码格式化、代码重构、代码调试等等,使编写代码更加高效和舒适。GoLand的特点包括:1.智能代码补全:GoLand能够根据上下文自动补全代码,包括函数
绣鸾 绣鸾
2年前
GoLand 2023 for Mac GO语言集成开发工具
是一款专门为Go语言开发者打造的集成开发环境(IDE)。它能够提供一系列功能,如代码自动完成、语法高亮、代码格式化、代码重构、代码调试等等,使编写代码更加高效和舒适。GoLand的特点包括:1.智能代码补全:GoLand能够根据上下文自动补全代码,包括函数
流浪剑客 流浪剑客
2年前
GoLand 2023.2.4汉化版 附 完整安装教程 支持M1
是一款专门为Go语言开发者打造的集成开发环境(IDE)。它能够提供一系列功能,如代码自动完成、语法高亮、代码格式化、代码重构、代码调试等等,使编写代码更加高效和舒适。GoLand的特点包括:1.智能代码补全:GoLand能够根据上下文自动补全代码,包括函数
彻底改变你的代码:JavaScript linter—Oxlint
作为开发人员,总是在寻找能够简化工作流程并提高工作效率的工具。Oxlint是一个用Rust编写的JavaScriptlinter,现在提供了可以替代ESLint的新方案,其性能比ESLint提升了50100倍。在本文中,将学习如何将Oxlint集成到开发流
彻底改变你的代码:JavaScript linter—Oxlint
作者:京东保险张洁作为开发人员,总是在寻找能够简化工作流程并提高工作效率的工具。Oxlint是一个用Rust编写的JavaScriptlinter,现在提供了可以替代ESLint的新方案,其性能比ESLint提升了50100倍。在本文中,将学习如何将Oxl