国产xxxx99真实实拍_久久不雅视频_高清韩国a级特黄毛片_嗯老师别我我受不了了小说

資訊專欄INFORMATION COLUMN

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

番茄西紅柿 / 2076人閱讀

摘要：如何為你的項目添加配置如何為你的項目添加配置現在已經是年了，網上許多教程和分享帖都已經過期，照著他們的步驟來會踩一些坑，如已經不再維護，以及之后文件只剩下部分等。如有疑問或授權協商請與我聯系。

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

現在已經是 9102 年了，網上許多教程和分享帖都已經過期，照著他們的步驟來會踩一些坑，如 stylelint-processor-html 已經不再維護，以及 --fix 之后 .vue 文件只剩下

但是隨之而來的是一個常見錯誤：你在文件頭部忽略了對瀏覽器前綴的提示，卻在另一個遙遠的地方由于暫時性允許同名屬性，通過 /* stylelint-enable */ 把之前所有忽略的規則都重新開啟了。所以一定要注意，只 enable 對應的規則，形成呼應：

其他注意事項

  1. 解析 .vue 文件（單文件組件）時請勿使用 processors

    網上一些過時的教程包括 github 上的討論都推薦使用 stylelint-processor-html 或者 @mapbox/stylelint-processor-arbitrary-tags 來解析 html 或 vue 中的 css ，這本身并沒有什么問題，但是這個插件有個 bug ，當指定 stylelint 的 --fix 后將會把 vue 文件中 以外的部分刪掉。

    我們使用自定義語法 postcss-html 或者保留 stylelint-scss 插件就足夠了。

  2. 一些規則在跑 --fix 選項時是有 bug 的

    比如 declaration-block-semicolon-newline-after 設置 "always" 時，不允許多條 css 規則寫在一行，但自動修復后可能會出現縮進不正確：

    修復后（示例，之前配置時沒嘗試去找必現路徑）：

    如果你也出現這種情況，可以再指定 indentation 規則的基準縮進（ baseIndentLevel ）：

    module.exports = {
    ...
    rules: {
        ...
        'indentation': [2, {
            'baseIndentLevel': 1,
        }],
        'declaration-block-semicolon-newline-after': 'always'
    }
};

參考鏈接

  1. Prettier + Stylelint: Writing Very Clean CSS (Or, Keeping Clean Code is a Two-Tool Game)
  2. 如何在Vue+Webpack下配置Stylelint - 簡書
  3. vue單文件組件lint error自動fix及styleLint報錯自動fix - segmentfault
  4. Stylelint in .vue - 掘金



本文基于 知識共享署名-非商業性使用-相同方式共享 4.0 國際許可協議 發布，歡迎引用、轉載或演繹，但是必須保留本文的署名 BlackStorm 以及本文鏈接 http://www.cnblogs.com/BlackStorm/p/add-stylelint-to-your-vue-project.html ，且未經許可不能用于商業目的。如有疑問或授權協商請與我聯系。

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/1365.html

相關文章

  • 工程搭建---代碼風格統一

    摘要：為此我們需要安裝這個是用于提交代碼的鉤子函數安裝完之后，我們就需要在增加運行鉤子函數。等鉤子函數這樣就簡單的成功對代碼進行效驗了，當然這邊更進一步的可以使用這個可以將取得所有被提交的文件依次執行寫好的任務。 一個項目是會有多個成員來開發的，因此統一開發規范是很有必要的，不然每個人都有自己的風格，同步之后代碼都會報錯。我這邊是用Vscode編譯器的。 首先用vue-cli3.0創建一個工...

    levius 評論0 收藏0

  • 從 0 到 1 再到 100, 搭建、編寫、構建一個前端項目

    摘要：從到再到搭建編寫構建一個前端項目選擇現成的項目模板還是自己搭建項目骨架搭建一個前端項目的方式有兩種選擇現成的項目模板自己搭建項目骨架。使用版本控制系統管理源代碼項目搭建好后，需要一個版本控制系統來管理源代碼。 從 0 到 1 再到 100, 搭建、編寫、構建一個前端項目 1. 選擇現成的項目模板還是自己搭建項目骨架 搭建一個前端項目的方式有兩種：選擇現成的項目模板、自己搭建項目骨架。 ...

    call_me_R 評論0 收藏0

  • 從 0 到 1 再到 100, 搭建、編寫、構建一個前端項目

    摘要：從到再到搭建編寫構建一個前端項目選擇現成的項目模板還是自己搭建項目骨架搭建一個前端項目的方式有兩種選擇現成的項目模板自己搭建項目骨架。使用版本控制系統管理源代碼項目搭建好后，需要一個版本控制系統來管理源代碼。 從 0 到 1 再到 100, 搭建、編寫、構建一個前端項目 1. 選擇現成的項目模板還是自己搭建項目骨架 搭建一個前端項目的方式有兩種：選擇現成的項目模板、自己搭建項目骨架。 ...

    wzyplus 評論0 收藏0

  • 從 0 到 1 再到 100, 搭建、編寫、構建一個前端項目

    摘要：從到再到搭建編寫構建一個前端項目選擇現成的項目模板還是自己搭建項目骨架搭建一個前端項目的方式有兩種選擇現成的項目模板自己搭建項目骨架。使用版本控制系統管理源代碼項目搭建好后，需要一個版本控制系統來管理源代碼。 從 0 到 1 再到 100, 搭建、編寫、構建一個前端項目 1. 選擇現成的項目模板還是自己搭建項目骨架 搭建一個前端項目的方式有兩種：選擇現成的項目模板、自己搭建項目骨架。 ...

    aristark 評論0 收藏0

  • 【翻譯】用PostCSS改善你的CSS代碼質量

    摘要：代碼質量這個術語對于程序員來說并不陌生。在本文中，我們將探討我們如何能夠利用幫助我們，保持我們的代碼質量更高。怎樣使用在這篇文章中，我們重點介紹幾個插件，可以幫助我們提高代碼質量。使用相當簡單的。這兩個插件可用于代碼分析。 代碼質量這個術語對于程序員來說并不陌生。畢竟，每個開發人員都知道，代碼只是能工作是不夠的。它還應該具備其他要素：它應該是可讀的，良好的格式和一致性。它也應該符合一些...

    sorra 評論0 收藏0

發表評論

0條評論

最新活動
閱讀需要支付1元查看
<