sublimelinter_开发人员使用SublimeLinter指南

Linter是现代Web开发中必不可少的工具。 它有助于我们在编写代码时检查错误并执行最佳实践。 如果您使用的是SublimeText,我强烈建议您安装SublimeLinters。 多年来,SublimeLinters逐渐成为SublimeText中的强大工具套件,并带来了连接到各种编程语言的linter的官方软件包。

在本教程中,我们将看到如何安装和设置SublimeLinter。 让我们开始吧。

入门

安装SublimeLinter 4的最简单方法是通过SublimeText Package Control 。 从那时起,在SublimeLinter 3中 ,每个棉绒必须单独安装。 这使得SublimeLinter仅通过运行,我们已经安装了棉绒更有效地运行。

由于我在项目中大部分时间都使用HTML,CSS,JS和PHP,因此我想为这些语言安装短毛绒。 在Package Control中 ,我将SublimeLinter与以下插件一起安装:

然后,为了使这些插件工作,我们还需要安装linter的语言,这是HTML整洁CSSLintJSHint ,和PHP CLI

对于使用OSX的用户,系统中已预装了Tidy和PHP。 要进行验证,请连续运行以下两个命令。

tidy --version
php --version

这些命令将向您显示您拥有的Tidy和PHP版本。 您可以继续在Sublime Text中使用它们。

检查版本

如果您使用的是Windows或Linux,或者未安装它们,则可以按照以下说明进行操作。

安装HTML Tidy

要安装HTML Tidy:

  • 在OSX中,在Terminal brew install homebrew/dupes/tidy运行此命令
  • 在Linux中,使用此命令sudo apt-get install tidy
  • 在Windows中,您可以从TidyBatchFiles中获取EXE安装程序。
安装PHP CLI
  • OSX用户可以使用curl -s http://php-osx.liip.ch/install.sh | bash -s 5.5在系统中安装PHP。 curl -s http://php-osx.liip.ch/install.sh | bash -s 5.5命令。 在撰写本文时,它将安装最新版本PHP 5.5。
  • Linux用户可以阅读DigitalOcean的综合教程
  • 对于Windows用户,您可以在此处下载安装程序
安装Styleint

接下来,我们将安装名为StylelintCSS linter ,这将使我们能够检查并执行CSS文件中的最佳做法。 在所有三个平台上均可遵循以下说明:OSX,Windows和Linux。 我假定你已经安装的Node.jsNPM

要安装Stylelint,请运行:

npm install -g stylelint

请注意,您还需要将Stylelint配置文件添加到您的项目目录,此外还需要安装诸如stylelint-config-standard之类的预定义配置。 一旦配置了这些,您将发现以下突出显示的错误。

样式错误
安装ESLint

我们还将安装ESLint,这是一种用于JavaScript的现代且高度可配置的linter。 这将帮助我们执行最佳实践,并在编写JavaScript时捕获潜在的错误。 安装ESLint还需要Node.js和NPM。

要安装它,请运行。

npm install -g eslint

同样,您需要将ESLint配置添加到项目中,或使用预定义的配置,例如eslint-config-recommended

我们都准备好了。 我们可以开始使用SublimeLinter 4 掉毛 HTML,CSS,JS和PHP在SublimeText。

SublimeLinter 4的新功能

SublimeLinter 4带来了几项新功能,其中一个面板易于显示,该面板显示了打开文件的所有错误。 如果您使用的是Mac,请按Command + Ctrl + A。 在Windows和Linux中,您可以按Ctrl + KCtrl + A。

热键将显示错误列表,如以下屏幕截图所示。

错误面板

使用浏览列表,页面将滚动到发生错误的确切行。

更好的视觉

现在,我们可以将鼠标悬停在编辑器中的装订线上方,也可以将鼠标悬停在发生错误的行上以查看错误消息。 在以前的版本中这是不可能的。

悬停错误
高度可配置

SublimeLinter 4现在比以往任何时候都更具可配置性。 例如,我们现在可以为每个linter配置自定义“样式”。 这使我们可以分别为每个棉短绒设置图标,颜色,棉绒模式,路径和环境变量。

用户设定
进一步参考

我希望这段简短的介绍可以帮助SublimeLinter入门和运行。 如果您想了解更多高级内容,也可以参考该参考。


翻译自: https://www.hongkiat.com/blog/guide-to-using-sublimelinter4/

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
非常感谢您的提问!在Sublime Text中配置Anaconda系统,您可以按照以下步骤进行操作: 1. 首先,您需要安装Anaconda,可以从官网下载并安装。 2. 打开Sublime Text,进入Preferences -> Package Control,安装Anaconda插件。 3. 安装完成后,进入Preferences -> Package Settings -> Anaconda -> Settings - User,将以下代码复制到文件中: { "python_interpreter": "/path/to/python", "anaconda_linting": false, "anaconda_linting_behaviour": "load-save", "anaconda_gutter_marks": true, "anaconda_gutter_theme": "dot", "anaconda_linter_phantoms": true, "anaconda_linter_underlines": true, "anaconda_linter_mark_style": "none", "anaconda_linter_mark_style_priority": 0, "anaconda_linter_mark_style_error": "dot", "anaconda_linter_mark_style_warning": "circle", "anaconda_linter_mark_style_note": "bookmark", "anaconda_linter_mark_style_highlight": "outline", "anaconda_linter_mark_style_highlight_priority": 0, "anaconda_linter_mark_style_highlight_error": "dot", "anaconda_linter_mark_style_highlight_warning": "circle", "anaconda_linter_mark_style_highlight_note": "bookmark", "anaconda_linter_mark_style_highlight_highlight": "outline", "anaconda_linter_mark_style_highlight_highlight_priority": 0, "anaconda_linter_mark_style_highlight_highlight_error": "dot", "anaconda_linter_mark_style_highlight_highlight_warning": "circle", "anaconda_linter_mark_style_highlight_highlight_note": "bookmark", "anaconda_linter_mark_style_highlight_highlight_highlight": "outline", "anaconda_linter_mark_style_highlight_highlight_highlight_priority": 0, "anaconda_linter_mark_style_highlight_highlight_highlight_error": "dot", "anaconda_linter_mark_style_highlight_highlight_highlight_warning": "circle", "anaconda_linter_mark_style_highlight_highlight_highlight_note": "bookmark", "anaconda_linter_mark_style_highlight_highlight_highlight_highlight": "outline", "anaconda_linter_mark_style_highlight_highlight_highlight_highlight_priority": 0, "anaconda_linter_mark_style_highlight_highlight_highlight_highlight_error": "dot", "anaconda_linter_mark_style_highlight_highlight_highlight_highlight_warning": "circle", "anaconda_linter_mark_style_highlight_highlight_highlight_highlight_note": "bookmark", "anaconda_linter_mark_style_highlight_highlight_highlight_highlight_highlight": "outline", "anaconda_linter_mark_style_highlight_highlight_highlight_highlight_highlight_priority": 0, "anaconda_linter_mark_style_highlight_highlight_highlight_highlight_highlight_error": "dot", "anaconda_linter_mark_style_highlight_highlight_highlight_highlight_highlight_warning": "circle", "anaconda_linter_mark_style_highlight_highlight_highlight_highlight_highlight_note": "bookmark" } 4. 将其中的"/path/to/python"替换为您的Python解释器的路径。 5. 保存文件后,重启Sublime Text即可完成配置。 希望这个回答能够帮助到您!

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值