FECS 是基于 Node.js 的前端代码风格工具套件,包含对 JavaScript、CSS 与 HTML 的检查及格式化。
- 安装FECS以及sublime插件
- 代码检查
- 代码格式化
官方github说明
Mac下FECS以及sublime插件安装说明
$ [sudo] npm install fecs -g
//没了..就是那么简单
//fecs -v能看到版本就是安装成功了
接下来我们来装sublime插件(Baidu-FE-Code-Style(下载地址),也可以直接使用命令)
cd ~/Library/Application\ Support/Sublime\ Text\ 2/Packages/
git clone https://github.com/leeight/Baidu-FE-Code-Style.git
chmod -R 777 Baidu-FE-Code-Style/
//一定要开读写权限,755就够了
装完插件记得配置node和fecs的环境变量
Preferences
->Package Settings
->Baidu-FE-Code-Style
->Settings -User
。
{
"env": {
"fecs_bin": "/usr/local/bin/fecs",
"node_bin": "/usr/local/bin/node"
}
}
//填写系统路径
FECS的代码检查功能
$ fecs check [target...]
$ fecs check [target...] --type=js,css
$ fecs check [target...] --type=html
//[target...]为目录名称
结果
以上省略一万行...
fecs ERROR → line 134, col 2: Newline required at end of file but not found. //书写不规范的地方
fecs INFO Linter found 24,517 errors in 93 of 100 files.
//文件数、错误数
fecs@0.8.4: 8216ms //耗时
FECS的代码格式化功能
$ fecs format [target...]
$ fecs format [target...] --type=js,css
//[target...]为目录名称
//Input
cd /Applications/XAMPP/htdocs/cli-im-new/Fist/static/
fecs format css --type=css
$$在当前目录下生成了一个output文件夹,用于存放格式化后的文件$$
百度声明:目前对 HTML 代码的格式化的实现还处于测试阶段,不建议使用时作自定义配置。(所以批量代码格式化功能目前目测只能用于格式化HTML与css,不敢去替换js)
作者 @郑小明
2016 年 08 月 15 日