首頁 開發工具 sublime SublimeText3配置react語法校驗

SublimeText3配置react語法校驗

Sep 06, 2019 pm 01:41 PM

SublimeText3是一款跨平台程式碼編輯器軟體,SublimeText3既可以編寫程式碼還可以編輯文本,是程式設計師必備的工具。以下由sublime使用教學專欄為大家介紹關於SublimeText3配置react語法校驗,希望對需要的朋友有幫助!

SublimeText3配置react語法校驗

1. 安裝nodejs

#2. 開啟終端,安裝eslint校驗套件與react校驗外掛程式包:

npm install -g eslint
npm install -g eslint-plugin-react
登入後複製

3. 在Sublime中安裝外掛程式:

SublimeLinter
SublimeLinter-contrib-eslint
登入後複製

4. 執行eslint --init

#根據提示配置初始化文件,產生.json格式的

5. 配置.eslintrc

.eslintrc.json

{
        "plugins": [
                // "react",
                "html"
        ],
        "env": {
                "node": true,
                "jquery": true,
                "es6": true,
                "browser": true
        },
        "globals": {
                "angular": false
        },
        "parser": "babel-eslint",
        "rules": {
                //官方文档 http://eslint.org/docs/rules/
                //参数:0 关闭,1 警告,2 错误
                // "quotes": [0, "single"],                  //建议使用单引号
                // "no-inner-declarations": [0, "both"],     //不建议在{}代码块内部声明变量或函数
                "no-extra-boolean-cast": 1, //多余的感叹号转布尔型
                "no-extra-semi": 1, //多余的分号
                "no-extra-parens": 0, //多余的括号
                "no-empty": 1, //空代码块
 
                //使用前未定义
                "no-use-before-define": [
                        0,
                        "nofunc"
                ],
 
                "complexity": [0, 10], //圈复杂度大于*
 
                //定义数组或对象最后多余的逗号
                "comma-dangle": [
                        0,
                        "never"
                ],
 
                // 不允许对全局变量赋值,如 window = 'abc'
                "no-global-assign": ["error", {
                        // 定义例外
                        // "exceptions": ["Object"]
                }],
                "no-var": 0, //用let或const替代var
                "no-const-assign": 2, //不允许const重新赋值
                "no-class-assign": 2, //不允许对class重新赋值
                "no-debugger": 1, //debugger 调试代码未删除
                "no-console": 0, //console 未删除
                "no-constant-condition": 2, //常量作为条件
                "no-dupe-args": 2, //参数重复
                "no-dupe-keys": 2, //对象属性重复
                "no-duplicate-case": 2, //case重复
                "no-empty-character-class": 2, //正则无法匹配任何值
                "no-invalid-regexp": 2, //无效的正则
                "no-func-assign": 2, //函数被赋值
                "valid-typeof": 1, //无效的类型判断
                "no-unreachable": 2, //不可能执行到的代码
                "no-unexpected-multiline": 2, //行尾缺少分号可能导致一些意外情况
                "no-sparse-arrays": 1, //数组中多出逗号
                "no-shadow-restricted-names": 2, //关键词与命名冲突
                "no-undef": 1, //变量未定义
                "no-unused-vars": 1, //变量定义后未使用
                "no-cond-assign": 2, //条件语句中禁止赋值操作
                "no-native-reassign": 2, //禁止覆盖原生对象
                "no-mixed-spaces-and-tabs": 0,
 
 
 
                //代码风格优化 --------------------------------------
                "no-irregular-whitespace": 0,
                "no-else-return": 0, //在else代码块中return,else是多余的
                "no-multi-spaces": 0, //不允许多个空格
 
                //object直接量建议写法 : 后一个空格前面不留空格
                "key-spacing": [
                        0,
                        {
                                "beforeColon": false,
                                "afterColon": true
                        }
                ],
 
                "block-scoped-var": 1, //变量应在外部上下文中声明,不应在{}代码块中
                "consistent-return": 1, //函数返回值可能是不同类型
                "accessor-pairs": 1, //object getter/setter方法需要成对出现
 
                //换行调用对象方法  点操作符应写在行首
                "dot-location": [
                        1,
                        "property"
                ],
                "no-lone-blocks": 1, //多余的{}嵌套
                "no-labels": 1, //无用的标记
                "no-extend-native": 1, //禁止扩展原生对象
                "no-floating-decimal": 1, //浮点型需要写全 禁止.1 或 2.写法
                "no-loop-func": 1, //禁止在循环体中定义函数
                "no-new-func": 1, //禁止new Function(...) 写法
                "no-self-compare": 1, //不允与自己比较作为条件
                "no-sequences": 1, //禁止可能导致结果不明确的逗号操作符
                "no-throw-literal": 1, //禁止抛出一个直接量 应是Error对象
 
                //不允return时有赋值操作
                "no-return-assign": [
                        1,
                        "always"
                ],
 
                //不允许重复声明
                "no-redeclare": [
                        1,
                        {
                                "builtinGlobals": true
                        }
                ],
 
                //不执行的表达式
                "no-unused-expressions": [
                        0,
                        {
                                "allowShortCircuit": true,
                                "allowTernary": true
                        }
                ],
                "no-useless-call": 1, //无意义的函数call或apply
                "no-useless-concat": 1, //无意义的string concat
                "no-void": 1, //禁用void
                "no-with": 1, //禁用with
                "space-infix-ops": 0, //操作符前后空格
 
                //jsdoc
                "valid-jsdoc": [
                        0,
                        {
                                "requireParamDescription": true,
                                "requireReturnDescription": true
                        }
                ],
 
                //标记未写注释
                "no-warning-comments": [
                        1,
                        {
                                "terms": [
                                        "todo",
                                        "fixme",
                                        "any other term"
                                ],
                                "location": "anywhere"
                        }
                ],
                "curly": 0 //if、else、while、for代码块用{}包围
        }
}
登入後複製

以上是SublimeText3配置react語法校驗的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

AI Hentai Generator

AI Hentai Generator

免費產生 AI 無盡。

熱門文章

R.E.P.O.能量晶體解釋及其做什麼(黃色晶體)
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳圖形設置
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.如果您聽不到任何人,如何修復音頻
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.聊天命令以及如何使用它們
1 個月前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

崇高的文字生產力黑客:加快您的編碼工作流程 崇高的文字生產力黑客:加快您的編碼工作流程 Apr 03, 2025 am 12:20 AM

使用SublimeText提升編程效率的方法包括:1)熟練使用快捷鍵,如Ctrl Shift D複製行;2)利用多行編輯功能,如Ctrl 鼠標點擊選擇多位置;3)安裝插件,如Emmet生成HTML/CSS代碼;4)自定義配置文件,如設置字體大小和顏色主題。掌握這些技巧可以大大提升你的編碼速度和工作效率。

高級崇高文本自定義:主題,鍵綁定和軟件包 高級崇高文本自定義:主題,鍵綁定和軟件包 Apr 04, 2025 am 12:05 AM

定制SublimeText的方法包括:1.創建並修改主題文件,如MyTheme.sublime-theme,調整編輯器外觀;2.自定義按鍵綁定,通過Default(Windows).sublime-keymap文件設置快捷鍵;3.安裝PackageControl並通過它管理插件,如Emmet和SublimeLinter,擴展編輯器功能。

崇高的文本命令調色板:釋放崇高的力量 崇高的文本命令調色板:釋放崇高的力量 Apr 07, 2025 am 12:17 AM

使用SublimeText的CommandPalette可以提高工作效率。 1)打開CommandPalette(Ctrl Shift P/Windows/Linux,Cmd Shift P/Mac)。 2)輸入命令關鍵字,如"InstallPackage"或"DarkTheme"。 3)選擇並執行命令,如安裝插件或切換主題。通過這些步驟,CommandPalette能幫助你快速執行各種任務,提升編輯體驗。

崇高的文本項目管理:組織和導航代碼庫 崇高的文本項目管理:組織和導航代碼庫 Apr 08, 2025 am 12:05 AM

SublimeText的項目管理功能可以通過以下步驟高效組織和導航代碼庫:1.創建項目文件,使用Project菜單中的SaveProjectAs...保存.sublime-project文件。 2.配置項目文件,指定包含的文件夾和設置,如排除特定文件或設置構建系統。 3.打開項目文件,通過Project菜單中的OpenProject快速加載項目環境。 4.優化項目文件,避免包含過多文件夾,使用排除模式提升導航速度。通過這些步驟,你可以利用SublimeText的項目管理功能,提升開發效率和代碼質量。

崇高的文本構建系統:直接編譯和運行代碼 崇高的文本構建系統:直接編譯和運行代碼 Apr 05, 2025 am 12:12 AM

SublimeText的BuildSystems可以通過配置文件自動化編譯和運行代碼。 1)創建JSON配置文件,定義編譯和運行命令。 2)使用快捷鍵觸發BuildSystems執行命令。 3)優化配置以提高性能,如使用緩存和並行編譯。這讓開發者能專注於編寫代碼,提升開發效率。

崇高的文本正則表達式:掌握搜索並替換 崇高的文本正則表達式:掌握搜索並替換 Apr 06, 2025 am 12:15 AM

在SublimeText中使用正則表達式進行搜索和替換可以通過以下步驟實現:1.打開搜索和替換功能,使用快捷鍵Ctrl H(Windows/Linux)或Cmd Opt F(Mac)。 2.勾選"正則表達式"選項,輸入正則表達式模式進行搜索和替換。 3.使用捕獲組提取匹配內容,例如使用https?://(1 )提取URL中的域名。 4.測試和調試正則表達式,確保正確匹配所需內容。 5.優化正則表達式,避免過度匹配和使用非貪婪匹配提高性能。 /↩

崇高的文本軟件包控制:掌握軟件包管理 崇高的文本軟件包控制:掌握軟件包管理 Apr 09, 2025 am 12:08 AM

PackageControl通過以下步驟提升SublimeText的開發體驗:1.安裝PackageControl,使用幾行命令即可完成。 2.通過快捷鍵或菜單訪問PackageControl,進行插件的安裝、更新和刪除。 3.定期清理和更新插件,優化性能並提升開發效率。通過這些操作,開發者可以專注於編程,提升整體開發體驗。

崇高的文字:解釋的許可證詳細信息 崇高的文字:解釋的許可證詳細信息 Apr 10, 2025 am 09:34 AM

SublimeText的許可證是永久性的數字密鑰,用於解鎖所有功能並去除試用提示。購買後通過官方網站激活,同一密鑰可用於多設備個人使用,需避免違反使用條款。

See all articles