成人无码视频,亚洲精品久久久久av无码,午夜精品久久久久久毛片,亚洲 中文字幕 日韩 无码

資訊專欄INFORMATION COLUMN

stylelint總結(jié)

MingjunYang / 1317人閱讀

摘要：有一百多條校驗規(guī)則這些規(guī)則可以分為三類用于校對風(fēng)格的規(guī)則用于判別代碼可維護(hù)性的規(guī)則以及用于判斷代碼錯誤的規(guī)則。所有規(guī)則默認(rèn)都是關(guān)閉的。聲明后還需要在中使用它，具體規(guī)則名稱以及可能的取值需要去查看每個插件的文檔。

stylelint有一百多條校驗規(guī)則, 這些規(guī)則可以分為三類：用于校對風(fēng)格的規(guī)則、用于判別代碼可維護(hù)性的規(guī)則、以及用于判斷代碼錯誤的規(guī)則。雖然條數(shù)眾多，但是不用怕，因為都是默認(rèn)關(guān)閉的，我們可以靈活地進(jìn)行配置

1、安裝 
npm install stylelint --save-dev
npm install stylelint-config-standard --save-dev

其中stylelint是運(yùn)行工具，stylelint-config-standard是推薦的配置，

2、配置文件

創(chuàng)建配置文件有3種方式：
（1）.stylelintrc

{
    "rules": {
        "declaration-block-trailing-semicolon": null
    }
}

(2) stylelint.config.js

module.exports = {
    "rules": {
        "declaration-block-trailing-semicolon": null
    }
}

(3) package.json

{
    ......
    "stylelint": {
        "rules": {
            "color-hex-case": "lower"
        }
    }
}

主要的配置項有extends、rules等
extends
extends用來擴(kuò)展配置項

{
  "extends": "stylelint-config-standard",
}

rules
rules是一個對象，屬性名為規(guī)則名稱，屬性值為規(guī)則取值，它告訴stylelint該檢查什么，該怎么報錯。所有規(guī)則默認(rèn)都是關(guān)閉的。
規(guī)則的類型不同，取值也不同。規(guī)則的取值請戳這里：規(guī)則的取值

{
  "rules": {
    "at-rule-blacklist": string|[],
    "at-rule-empty-line-before": "always"|"never",
    "at-rule-name-case": "lower"|"upper",
    "block-no-empty": true
    ...
  }
}

規(guī)則的值為null時表示禁用該規(guī)則

{
  "rules": {
    "block-no-empty": null
  }
}

rules還可以支持一些自定義配置，給規(guī)則傳遞一個數(shù)組即可，數(shù)組第一項是規(guī)則值，第二項是自定義配置。例如：
（1）指定錯誤級別：

"indentation": [2, { 
  "severity": "warning" 
}]

（2）自定義錯誤信息

"color-hex-case": ["lower", {
    "message": "Lowercase letters are easier to distinguish from numbers"
}]

plugins
插件一般是由社區(qū)提供的，對stylelint已有規(guī)則進(jìn)行擴(kuò)展，一般可以支持一些非標(biāo)準(zhǔn)的css語法檢查或者其他特殊用途。一個插件會提供一個或者多個檢查規(guī)則。
plugins聲明后還需要在rules中使用它，具體規(guī)則名稱以及可能的取值需要去查看每個插件的文檔。

{
  "plugins": [
    "../some-rule-set.js"
  ],
  "rules": {
    "some-rule-set/first-rule": "everything",
    "some-rule-set/second-rule": "nothing",
    "some-rule-set/third-rule": "everything"
  }
}
3、webpack的使用

webpack需要使用插件stylelint-webpack-plugin
具體用法如下：

var StyleLintPlugin = require("stylelint-webpack-plugin");
 
module.exports = {
  // ... 
  plugins: [
    new StyleLintPlugin(options),
  ],
  // ... 
}
簡單配置示例

stylelink.config.js

module.exports = {
    "extends": "stylelint-config-standard",
    "rules": {
        "declaration-block-trailing-semicolon": null
    }
}

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/99925.html

相關(guān)文章

  • Lint Your Code

    摘要：形成良好統(tǒng)一的代碼規(guī)范，有利于提高代碼的可讀性，減少潛在的錯誤，便于團(tuán)隊協(xié)作開發(fā)。其中是可選的，如果沒有則禁用所有規(guī)則，如果有則禁用所有規(guī)則。也可以定義一個命令同時運(yùn)行這兩個命令，我在這里使用了我們定義了在鉤子觸發(fā)時會執(zhí)行命令。 形成良好統(tǒng)一的代碼規(guī)范，有利于提高代碼的可讀性，減少潛在的錯誤，便于團(tuán)隊協(xié)作開發(fā)。本文簡單介紹JS、CSS、 Git Commit 的規(guī)范工具及用法。 Lin...

    hidogs 評論0 收藏0

  • 如何為你的 Vue 項目添加配置 Stylelint

    摘要：如何為你的項目添加配置如何為你的項目添加配置現(xiàn)在已經(jīng)是年了，網(wǎng)上許多教程和分享帖都已經(jīng)過期，照著他們的步驟來會踩一些坑，如已經(jīng)不再維護(hù)，以及之后文件只剩下部分等。如有疑問或授權(quán)協(xié)商請與我聯(lián)系。如何為你的 Vue 項目添加配置 Stylelint 現(xiàn)在已經(jīng)是 9102 年了，網(wǎng)上許多教程和分享帖都已經(jīng)過期，照著他們的步驟來會踩一些坑，如 stylelint-processor-html 已經(jīng)不...

    番茄西紅柿 評論0 收藏0

  • CSS代碼檢查工具stylelint

    摘要：所以校驗規(guī)則的行動迫在眉睫。是一個強(qiáng)大的現(xiàn)代檢測器，可以讓開發(fā)者在樣式表中遵循一致的約定和避免錯誤。本文將詳細(xì)介紹代碼檢查工具概述擁有超過條的規(guī)則，包括捕捉錯誤最佳實踐控制可以使用的語言特性和強(qiáng)制代碼風(fēng)格規(guī)范。但是，該命令一定要慎用。前面的話 　　CSS不能算是嚴(yán)格意義的編程語言，但是在前端體系中卻不能小覷。 CSS 是以描述為主的樣式表，如果描述得混亂、沒有規(guī)則，對于其他開發(fā)者一定是一個定...

    番茄西紅柿 評論0 收藏0

  • 引入stylelint對CSS/Sass做代碼審查

    摘要：規(guī)范越早引入越好，規(guī)范的約束永遠(yuǎn)不嫌多。是什么是一個基于的代碼審查工具，它易于擴(kuò)展，支持最新的語法，也理解類似的語法。是一個強(qiáng)大和現(xiàn)代的審查工具，有助于開發(fā)者推行統(tǒng)一的代碼規(guī)范，避免樣式錯誤。 規(guī)范越早引入越好，規(guī)范的約束永遠(yuǎn)不嫌多。 stylelint是什么？ stylelint 是一個基于 Javascript 的代碼審查工具，它易于擴(kuò)展，支持最新的 CSS 語法，也理解類似 CS...

    klinson 評論0 收藏0

  • stylelint 搭配 stylelint-order，更隨心所欲的編碼 CSS

    摘要：對于而言，不能算是嚴(yán)格意義的編程語言，但是在前端體系中卻不能小覷。為什么這么難學(xué)不是科學(xué)，而是藝術(shù)所以校驗規(guī)則的行動迫在眉睫，立即執(zhí)行。如何遵守提交的時候，以的形式人工校驗。以語法表示文件的路徑。嗯，這點很重要。 原文鏈接：http://hangyangws.win/2017/06... 為什么需要校驗 CSS 規(guī)則 對于編程語言進(jìn)行「語法、書寫」校驗，能有效「歸并」不同開發(fā)者的「不...

    Carson 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<