SublimeLinter 是 Sublime 的插件,它的作用是检查代码语法是否有错误,并提示。习惯了 IDE 下写代码的人一定需要一款在 Sublime 上类似的语法检查工具。下面我们开始。


安装 SublimeLinter

如同其他插件一样使用 Package Control 来安装。

  1. 按下 Ctrl+Shift+p 进入 Command Palette
  2. 输入install进入 Package Control: Install Package
  3. 输入SublimeLinter。进行安装.

安装完成后可以看到这样一段话:

Welcome to SublimeLinter, a linter framework for Sublime Text 3.

                  * * * IMPORTANT! * * *

         SublimeLinter 3 is NOT a drop-in replacement for
earlier versions. Linters *NOT* included with SublimeLinter 3,
they must be installed separately. The settings are different. * * * READ THE DOCS! * * * Otherwise you will never know how to install linters, nor will
you know about all of the great new features in SublimeLinter 3. For complete documentation on how to install and use SublimeLinter,
please see: http://www.sublimelinter.com

可以看到具体的 Linters 组件被包含在 SublimeLinter 3 中,所以我们要额外独立安装组件。 
可以针对不同的语言安装不同的组件。


JavaScript 语法检查

SublimeLinter-jshint 是基于 nodeJS 下的 jshint 的插件,实际上 SublimeLinter-jshint 调用了 nodeJS 中 jshint 的接口来进行语法检查的。


安装 SublimeLinter-jshint

为了让 JavaScript 代码有语法检查,我们安装 SublimeLinter-jshint 
同样的方法,我们安装 SublimeLinter-jshint

  1. 按下 Ctrl+Shift+p 进入 Command Palette
  2. 输入install进入 Package Control: Install Package
  3. 输入SublimeLinter-jshint。进行安装.

如下图

安装完成后我们可以看到下面的一段话

SublimeLinter-jshint
-------------------------------
This linter plugin for SublimeLinter provides an interface to jshint. ** IMPORTANT! ** Before this plugin will activate, you *must*
follow the installation instructions here: https://github.com/SublimeLinter/SublimeLinter-jshint

安装 nodeJS 和 jshint

在插件开始工作之前,我们必须再看一下上述插件的安装说明 
通过 SublimeLinter-jshint 的说明 我们可以看到,这个组件依赖于 nodeJS 下的 jshint,所以我们安装 nodeJS 环境和 nodeJS 下的 jshint。

  1. 安装 Node.js
  2. 通过 npm 安装jshint

在命令行下输入如下代码,完成安装

npm install -g jshint

安装完成后命令行中出现如下的信息

C:\Users\Administrator\AppData\Roaming\npm\jshint -> C:\Users\Administrator\AppData\Roaming\npm\node_modules\jshint\bin\jshint
jshint@2.6.3 C:\Users\Administrator\AppData\Roaming\npm\node_modules\jshint
├── strip-json-comments@1.0.2
├── underscore@1.6.0
├── exit@0.1.2
├── shelljs@0.3.0
├── console-browserify@1.1.0 (date-now@0.1.4)
├── htmlparser2@3.8.2 (domelementtype@1.3.0, entities@1.0.0, domhandler@2.3.0, readable-stream@1.1.13, domutils@1.5.1)
├── minimatch@1.0.0 (sigmund@1.0.0, lru-cache@2.5.0)
└── cli@0.6.6 (glob@3.2.11)

可以查看 jshint 版本,已确认安装完成。

C:\Users\Administrator>jshint -v
jshint v2.6.3

现在,恭喜你,我们使用 Sublime 编辑 JavaScript 文件,就会有语法检查了!

在编辑过程中,会有如下提示

点击提示点后,Sublime 状态栏也会有相应的说明


css 语法检查

与 jshint 同理,SublimeLinter-csslint 也是基于 nodeJS 下的 csslint 的插件,实际上 SublimeLinter-csslint 调用了 nodeJS 中 csslint 的接口来进行语法检查的。


安装 SublimeLinter-csslint

同样的方法。

  1. 按下 Ctrl+Shift+p 进入 Command Palette
  2. 输入install进入 Package Control: Install Package
  3. 输入SublimeLinter-csslint。进行安装.

如下图

安装完成后我们可以看到下面的一段话

SublimeLinter-csslint
-------------------------------
This linter plugin for SublimeLinter provides an interface to csslint. ** IMPORTANT! ** Before this plugin will activate, you *must*
follow the installation instructions here: https://github.com/SublimeLinter/SublimeLinter-csslint

在使用插件之前,必须遵循上述网址中的安装说明


在 nodeJS 下安装 csslint

进入上述的 GitHub 地址,csslint 的说明页。我们知道了和 jshint 一样,csslint 也是基于 nodeJS 下的 csslint 来使用的。

这里安装 nodeJS 过程省略。 
只需用 npm 安装 csslint 即可。

在命令行中输入

npm install -g csslint

安装完成后命令行中出现如下的信息

C:\Users\Administrator\AppData\Roaming\npm\csslint -> C:\Users\Administrator\AppData\Roaming\npm\node_modules\csslint\cli.js
csslint@0.10.0 C:\Users\Administrator\AppData\Roaming\npm\node_modules\csslint
└── parserlib@0.2.5

可以查看 csslint 版本,已确认安装完成。

C:\Users\Administrator>csslint --version
v0.10.0

现在,恭喜你,我们使用 Sublime 编辑 css 文件,就会有语法检查了!

在编辑过程中,会有如下提示

点击提示点后,Sublime 状态栏也会有相应的说明

代码校验工具 SublimeLinter 的安装与使用的更多相关文章

  1. 代码管理工具Git的安装及使用

    一:Git是什么? Git是目前世界上最先进的分布式版本控制系统. 二:SVN与Git的最主要的区别? SVN是集中式版本控制系统,版本库是集中放在中央服务器的,而干活的时候,用的都是自己的电脑,所以 ...

  2. ESLint – 可扩展的 JavaScript & JSX 校验工具

    ESLint 是一个开源的 JavaScript 代码校验工具,最初是由 Nicholas C. Zakas 在2013年创建的.经常被用来发现问题的模式或代码,不符合特定的风格准则. ESLint ...

  3. 在Sublime Text 3 中安装SublimeLinter,Node.js进行JS&CSS代码校验

    转载自:http://www.wiibil.com/website/sublimelinter-jshint-csslint.html 在Sublime Text中安装SublimeLinter,No ...

  4. 在SUBLIME TEXT中安装SUBLIMELINTER进行JS&CSS代码校验

    一:Sublime Text 中需要先安装Package Control.(如果有则无需安装) 安装方法:打开Sublime Text控制台(快捷键Ctrl+`),在控制台粘贴以下代码,按回车执行. ...

  5. sublime上安装c/c++代码分析工具 sublime Linter - cppcheck

    项目官方说明 sublime Linter - cppcheck 理解下sublime Linter - cppcheck, 它是插件的插件,sublime的插件sublimeLinter的插件.网络 ...

  6. Java静态代码分析工具——FindBugs插件的安装与使用

    1 什么是FindBugs FindBugs 是一个静态分析工具,它检查类或者 JAR 文件,将字节码与一组缺陷模式进行对比以发现可能的问题.有了静态分析工具,就可以在不实际运行程序的情况对软件进行分 ...

  7. 代码静态分析工具PC-LINT安装配置

    代码静态分析工具PC-LINT安装配置--step by step                             作者:ehui928                             ...

  8. SonarQube代码质量管理工具的安装(Linux)

    一.安装配置sonar 1.Sonar介绍 Sonar是一个用于代码质量管理的开源平台,用于管理Java源代码的质量.通过插件机制,Sonar 可以集成不同的测试工具,代码分析工具,以及持续集成工具, ...

  9. Eclipse代码规范工具-Checkstyle安装和使用

    您首先可以参考这里:http://www.ibm.com/developerworks/cn/java/j-ap01117/index.html 那么首先您应该下载CheStyle: http://s ...

随机推荐

  1. 设计师必备!免费下载 PSD 素材的32个网站

    今天我想和大家分享一组可以免费下载 PSD 图形素材的最好的网站. PSD 文件是非常有用的资源,因为你可以看到所有的层,使用了什么技术来创建出这些作品和效果. 某些列出的网站可能已是众所周知的,但你 ...

  2. 专门为码农定制的14款创意的T裇(T-Shirt)设计

    T裇衫是人们在各种场合都可穿着的服装,如在T裇衫上作适当的装饰,即可增添无穷的韵味.通过图案直接反映人类的精神风貌,你可以把日常生活中的兴趣.习惯.喜怒哀乐.嗜好等展露无疑,张扬个性.秀出自我.对于码 ...

  3. Direct3D11学习:(九)绘制基本几何体

    转载请注明出处:http://www.cnblogs.com/Ray1024 一.概述 Direct3D中很多复杂的几何效果都是由基本的几何体组合而成的,这篇文章中,我们来学习集中常见的基本几何体的绘 ...

  4. tips null和undefined的区别

    tips null和undefined的区别 1.undefined类型 undefined类型只有一个值,即特殊的undefined.在使用var声明变量但未对其加以初始化时,这个变量的值就是und ...

  5. 一个关于explain出来为all的说明及优化

    explain sql语句一个语句,得到如下结果,为什么已经创建了t_bill_invests.bid_id的索引,但却没有显示using index,而是显示all扫描方式呢,原来这还与select ...

  6. 重构第17天提取父类(Extract SuperClass)

    今天的重构来自 Martin Fowler的http://refactoring.com/catalog/extractSuperclass.html. 理解:本文中的“提取父类”是指类中有一些字段或 ...

  7. [CLR via C#]8. 方法

    一.实例构造器和类(引用类型) 类实例构造器是允许将类型的实例初始化为良好状态的一种特殊的方法. 类实例构造器方法在"方法定义元数据表"中始终叫.ctor(代表constructo ...

  8. [moka同学摘录]iptables防火墙规则的添加、删除、修改、保存

    文章来源:http://www.splaybow.com/post/iptables-rule-add-delete-modify-save.html 本文介绍iptables这个Linux下最强大的 ...

  9. angularJS中的$apply(),$digest(),$watch()

    $apply()和$digest()在AngularJS中是两个核心概念,但是有时候它们又让人困惑.而为了了解AngularJS的工作方式,首先需要了解$apply()和$digest()是如何工作的 ...

  10. Javascript中的Label语句

    在javascript中,我们可能很少会去用到 Label 语句,但是熟练的应用 Label 语句,尤其是在嵌套循环中熟练应用 break, continue 与 Label 可以精确的返回到你想要的 ...