nodejs+sublime+sublimelinter+jshint+javascript代码检查

本文详细介绍了如何在Sublime Text中安装并配置JSHint插件,实现JavaScript代码的自动检查和格式化,包括安装步骤、配置选项以及与jsformat插件的配合使用,旨在提升编码效率与代码质量。

sublime 安装jslint代码检查插进步骤:


1、安装nodejs。下载地址:http://nodejs.org/download/
2、在控制台安装jshint:$ npm install jshint -g
3、在sublime安装sublimelinter
4、在sublime安装jshint
5、配置sublimelinter:preference-package setting-sublimelinter-user

{
  "sublimelinter": "save-only",
   "jshint_options":
    {
        // To fix column positions for JSHint errors you may want to add `"indent": 1` to your
        // **User** "jshint_options". This issue affects users with tabs for indentation.
        // This fix was reverted due to a conflict with using the `"white": true` option.
        // "indent": 1,
        // 设置 JS 执行环境为浏览器
        "browser": true,
         // 加载 jQuery 的全局变量(jQuery、$)
        "jquery": true,
        //禁止下划线的变量名
        "nomen":true,
         // 行尾不要分号,false表示强制需要分号结尾
        "asi": false,
        "forin":false,//for in需要hasOwnProperty检查

        "white":true,
        // 其他全局变量,我用了 SeaJS
        "predef": [
             "define",
             "seajs",
             "console"
             ]
    },
    "sublimelinter_executable_map":
{
    "javascript":"C:/Program Files/nodejs/node.exe",
    "css":"C:/Program Files/nodejs/node.exe"
}
}

 

 

 

 

6、jsformat 和jslint的配合使用(主要使格式化操作复合jslint的要求)

 

 

preference-》package setting-》jsformat-》setting user添加一下配置,主要把jslint_happy改为true。

 

{
	// exposed jsbeautifier options
	"indent_with_tabs": false,
	"preserve_newlines": true,
	"max_preserve_newlines": 4,
	"space_in_paren": false,
	"jslint_happy": true,
	"brace_style": "collapse",
	"keep_array_indentation": false,
	"keep_function_indentation": false,
	"eval_code": false,
	"unescape_strings": false,
	"break_chained_methods": false,
	"e4x": false,
	"wrap_line_length": 0,

	// jsformat options
	"format_on_save": false,
	"format_selection": true,
	"jsbeautifyrc_files": false,
	"ignore_sublime_settings": true
}

 

最新版本sublimelinter

 

/*
    SublimeLinter default settings
*/
{
    /*
        Sets the mode in which SublimeLinter runs:

        true - Linting occurs in the background as you type.
        false - Linting only occurs when you initiate it.
        "load-save" - Linting occurs only when a file is loaded and saved (the default).
        "save-only" - Linting occurs only when a file is saved.
    */
    "sublimelinter": "save-only",

    /*
        Maps language names **as listed at the beginning of the README** (but all lowercase)
        to executables for non-built in linters. If the executable is not in the default system path,
        or on posix systems is not in /usr/local/bin or ~/bin, then you must specify
        the full path to the executable. Note that paths in Windows must use double
        backslashes, for example "C:\\Program Files (x86)\\nodejs\\node.exe".

        Please note that the map _keys_ do not always match the name of the
        executable, but rather the language syntax for the executable to lint.

        This is the effective default map; your mappings may override these.

        "sublimelinter_executable_map":
        {
            "perl": "perl",
            "php": "php",
            "ruby": "ruby"
        },
    */
    "sublimelinter_executable_map":
    {
        "javascript":"C:\\Program Files\\nodejs\\node.exe",
        "css":"C:\\Program Files\\nodejs\\node.exe"
    },

    /*
        Maps syntax names to linters. This allows variations on a syntax
        (for example "Python (Django)") to be linted. The key is
        the name of the syntax **as it appears in the syntax list
        at the bottom right of the window**, and the value
        is the linter name **as listed in the README** (all lowercase)
        that the syntax maps to.
    */
    "sublimelinter_syntax_map":
    {
        "Python Django": "python",
        "Ruby on Rails": "ruby",
        "C++": "c"
    },

    // An array of linter names to disable. Names should be lowercase.
    "sublimelinter_disable":
    [
    ],

    /*
        The minimum delay in seconds (fractional seconds are okay) before
        a linter is run when the "sublimelinter" setting is true. This allows
        you to have background linting active, but defer the actual linting
        until you are idle. When this value is greater than the built in linting delay,
        errors are erased when the file is modified, since the assumption is
        you don't want to see errors while you type.
    */
    "sublimelinter_delay": 2,

    /*
        Selects the way the lines with errors or warnings are marked; "outline" draws
        outline boxes around the lines, "fill" fills the lines with the outline color,
        and "none" (default) disables all outline styles.
    */
    "sublimelinter_mark_style": "none",

    /*
        If true, lines with errors or warnings will be filled in with the
        outline color.

        This setting is DEPRECATED and will be ignored in future
        versions. Use "sublimelinter_mark_style" instead. For backwards
        compatibility reasons, this setting overrides "sublimelinter_mark_style"
        if that one is set to "outline", but has no effect if it's set to "none".
    */
    "sublimelinter_fill_outlines": false,

    // If true, lines with errors or warnings will have a gutter mark.
    "sublimelinter_gutter_marks": true,

    /*
        Choose the theme for gutter marks; available built-in options are:
        "alpha", "bright", "dark", "hard" and "simple"

        Anything else will be treated as a path to a set of images.
        For instance, setting the value to "../User/my-awesome-theme"
        would cause SublimeLinter to look for the images:
        "../User/my-awesome-theme-illegal.png",
        "../User/my-awesome-theme-violation.png",
        "../User/my-awesome-theme-warning.png"
        These images should all be approximately 32x32px.
    */
    "sublimelinter_gutter_marks_theme": "simple",

    // If true, the find next/previous error commands will wrap.
    "sublimelinter_wrap_find": true,

    // If true, when the file is saved any errors will appear in a popup list
    "sublimelinter_popup_errors_on_save": true,

    // JavaScript linter: "gjslint" to use the closure javascript linter (if available),
    // or either "jshint" or "jslint" to use a built in linter.
    "javascript_linter": "jshint",

    // jshint: options for linting JavaScript. See http://www.jshint.com/docs/#options for more info.
    // By deault, eval is allowed.
    "jshint_options":
    {
        // To fix column positions for JSHint errors you may want to add `"indent": 1` to your
        // **User** "jshint_options". This issue affects users with tabs for indentation.
        // This fix was reverted due to a conflict with using the `"white": true` option.
        // "indent": 1,
        "evil": true,
        "quotmark": "single", //只能使用单引号
        "regexdash": true,
        "browser": true,
        "wsh": true,
        "trailing": true,
        "sub": true,
        "devel": true,
        "jquery":true,
        "nomen":true,
         // 行尾不要分号,false表示强制需要分号结尾
        "asi": false,
        "white": true,
        "indent": 4,//缩进
        "node": true,//node 环境
        "latedef": true, //先定义变量,后使用
        // 其他全局变量,我用了 SeaJS
        "predef": [
             "define",
             "seajs",
             "console"
            ]
    },

    // A list of command line options to send to gjslint. --nobeep is always sent.
    "gjslint_options":
    [
    ],

    // A list of gjslint error numbers to ignore. The list of error codes is here:
    // http://closure-linter.googlecode.com/svn/trunk/closure_linter/errors.py
    "gjslint_ignore":
    [
        110  // line too long
    ],

    // CSSLint options:
    // Each rule can have three values: error|warning|true|false
    // false => rule is disabled.
    // true => alias to 'error'
    // All rules are enabled by default.
    // Currently the only difference between warnings and errors is in the prefix of the message in the Sublime status bar.
    "csslint_options":
    {
        "adjoining-classes": "warning",
        "box-model": true,
        "box-sizing": "warning",
        "compatible-vendor-prefixes": "warning",
        "display-property-grouping": true,
        "duplicate-background-images": "warning",
        "duplicate-properties": true,
        "empty-rules": true,
        "errors": true,
        "fallback-colors": "warning",
        "floats": "warning",
        "font-faces": "warning",
        "font-sizes": "warning",
        "gradients": "warning",
        "ids": "warning",
        "import": "warning",
        "important": "warning",
        "known-properties": true,
        "outline-none": "warning",
        "overqualified-elements": "warning",
        "qualified-headings": "warning",
        "regex-selectors": "warning",
        "rules-count": "warning",
        "shorthand": "warning",
        "star-property-hack": "warning",
        "text-indent": "warning",
        "underscore-property-hack": "warning",
        "unique-headings": "warning",
        "universal-selector": "warning",
        "vendor-prefix": true,
        "zero-units": "warning"
    },

    // Set this to false to turn pep8 checking off completely
    "pep8": true,

    /*
        A list of pep8 error numbers to ignore. By default "line too long" errors are ignored.
        The list of error codes is in this file: https://github.com/jcrocholl/pep8/blob/master/pep8.py.
        Search for "Ennn:", where nnn is a 3-digit number.
    */
    "pep8_ignore":
    [
        "E501"
    ],

    /*
        If you use SublimeLinter for pyflakes checks, you can ignore some of the "undefined name xxx"
        errors (comes in handy if you work with post-processors, globals/builtins available only at runtime, etc.).
        You can control what names will be ignored with the user setting "pyflakes_ignore".

        Example:

        "pyflakes_ignore":
            [
                "some_custom_builtin_o_mine",
                "A_GLOBAL_CONSTANT"
            ],
    */
    "pyflakes_ignore":
    [
    ],

    /*
        Ordinarily pyflakes will issue a warning when 'from foo import *' is used,
        but it is ignored since the warning is not that helpful. If you want to see this warning,
        set this option to false.
    */
    "pyflakes_ignore_import_*": true,

    /*
        Perl linter: "perl" to use the Perl language syntax check, or "perlcritic" to use Perl::Critic linting.
        Perl is now set to use "perlcritic" by default due to a vulnerability with blindly running `perl -c`
        on files with `BEGIN` or `CHECK` blocks.
    */
    "perl_linter": "perlcritic",

    // Objective-J: if true, non-ascii characters are flagged as an error.
    "sublimelinter_objj_check_ascii": false,

    // Set to true to highlight annotations
    "sublimelinter_notes": false,

    // The set of annotation phrases to highlight
    "annotations": ["TODO", "README", "FIXME"]
}

 

 

新版本要注意设置 node:true

 

 

这样每次保存js文件的时候便会主动检查js代码规范,其中 "white":true配置个人尤为喜欢,有惊喜。

 

 

更详细的jshint配置

http://www.tuicool.com/articles/AzIRviR

 

注意如果你的项目中如果有.jshintrc文件的话,优先使用此文件配置,sublime本身配置将不会生效,被坑了

转载于:https://my.oschina.net/fengshuzi/blog/418970

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值