为了账号安全,请及时绑定邮箱和手机立即绑定

Atom 编辑器配置 ESLint 和 EditorConfig

标签:
Html/CSS

ESLint 是一个代码规范和语法错误检查工具。使用 ESLint 可以规范我们的代码书写,可以在编写代码期间就能发现一些低级错误。ESLint 需要结合编辑器或 IDE 使用。

EditorConfig 是一个保持缩进风格的一致的工具。当多人共同开发一个项目的时候,往往会出现每个人用不同编辑器的情况,而且有的人用 tab 缩进,有的人用 2 个空格缩进,有的人用 4 > 个空格缩进,EditorConfig 就是为了解决这个问题而诞生。EditorConfig 需要结合编辑器或 IDE 使用。

配置 ESLint

在 Atom 编辑器中,安装插件 linter 和 linter-eslint。

webp

linter.png

在项目目录中本地安装 eslint。由于我们没有选择全局安装 eslint,因此只要是想使用 eslint 的项目,都要本地安装 eslint,并且初始化生成一个 .eslintrc.json 的配置文件。

$ npm install eslint --save-dev

在项目目录中初始化 eslint 配置。

$ ./node_modules/.bin/eslint --init

依次选择以下选项:

  • Use a popular style guide

  • Standard

  • JSON

eslint 会创建一个 .eslintrc.json 的配置文件,同时自动安装并添加相关的模块到 devDependencies。这里我们使用 Standard 规范,其主要特点是不加分号。

至此,在你的项目目录 (包括子目录) 中使用 Atom 编辑器编辑以 .js 结尾的文件时,ESLint 会自动检查你的语法是否符合规范。

webp

lint.png

配置 EditorConfig

在 Atom 编辑器中,安装插件 editorconfig。

webp

editorconfig.png

在项目目录中创建 .editorconfig 配置文件。具体配置文件可以参考 https://atom.io/packages/editorconfig

# editorconfig.orgroot = true[*]
indent_style = space
indent_size = 2
end_of_line = lf
charset = utf-8
trim_trailing_whitespace = trueinsert_final_newline = truetab_width = 2

[*.md]
trim_trailing_whitespace = false[Makefile]
indent_style = tab

这里我们使用 2 个空格缩进,tab 长度也是 2 个空格。trim_trailing_whitespace 用来删除每一行最后多余的空格,insert_final_newline 用来在代码最后插入一个空的换行。

至此,在你的项目目录 (包括子目录) 中使用 Atom 编辑器编辑任何类型文件的时候,都会按照 editorconfig 的配置文件来自动处理空白字符。



作者:Karmack
链接:https://www.jianshu.com/p/4ab7ca35c523


点击查看更多内容
TA 点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
  • 推荐
  • 评论
  • 收藏
  • 共同学习,写下你的评论
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消