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

資訊專欄INFORMATION COLUMN

Prettier+VScode 治好你的代碼潔癖

qc1iu / 1196人閱讀

摘要：忍無可忍只能拔槍相見了。而只關心格式化文件最大長度混合標簽和空格引用樣式等。可見，代碼格式統一的問題，交給再合適不過了。和配合使用，風味更佳。我的配置文件如下到此，安裝完畢，使用就可格式化代碼。兩者配合才能使項目代碼優雅健壯

試想一個多人開發的項目，每次同步代碼，看到各個風格迥異，換行空格混亂，4格，2格縮進交替上演的代碼文件，分分鐘逼死強迫癥啊。忍無可忍只能拔槍相見了~~。統一的代碼風格規范，對于多人開發的大項目一定是必不可少的，但是口頭約定又是一定沒有用的（nice臉）。這時候就需要Prettier上場了，一個配置文件，配合VScode，保存即格式化，你的同事都不需要知道代碼風格是什么，，整個團隊只要clone項目，自動保持統一風格。搞定！

Prettier是什么 
Prettier is an opinionated code formatter. It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line length into account, wrapping code when necessary.

以上是github上的官方解釋，其實就是簡單的代碼格式工具，和esLint不同在于，ESLint只是一個代碼質量工具(確保沒有未使用的變量、沒有全局變量，等等)。而Prettier只關心格式化文件(最大長度、混合標簽和空格、引用樣式等)。可見，代碼格式統一的問題，交給Prettirer再合適不過了。和Eslint配合使用，風味更佳。

Prettier怎么用

編輯器插件

CLI命令行

編輯器

這里介紹VSCode中如何配置Prettier

安裝 Prettier插件 Prettier - Code formatter
安裝插件后，調出系統設置就能看到prettier相關選項了，如圖

添加自定義配置文件.prettierrc
作為項目的整體代碼規范，如果依賴本地配置，顯然是不科學的，所以需要.prettierrc 文件覆蓋本地配置。我的配置文件如下

   {
      "singleQuote": true,
      "trailingComma": "es5",
      "printWidth": 140,
      "overrides": [
        {
          "files": ".prettierrc",
          "options": { "parser": "json" }
        }
      ]
    }

到此，prettier安裝完畢，使用shift+alt+f就可格式化代碼。當然每次手動格式化還是很費力啊，怎么辦？自動保存。系統設置中增加"editor.formatOnSave": true即可自動保存，還要注意的一點是，如果同時設置了"files.autoSave": "autoSaveDelay",保存及格式化會失效。files.autoSave配置成別的選項即可。

另外，如果項目配置了.editorConfig文件，在配置了"editor.formatOnSave": true后，如果項目成員沒有安裝 Prettier 插件，保存時就會讀取.editorConfig文件，同樣可以格式化代碼。啟用 Prettier 插件后，.editorConfig的配置就會失效，讀取.prettierrc 文件的配置

命令行

命令行用法需要安裝prettier,npm install prettier --save-dev，使用prettier write **.js 就可以格式化文件。將添加到你的NPM腳本中，prettier --write "./src/**/*.js,這樣就可以批量格式化項目中的所有文件了。

結語

prettier只關心代碼格式，顯然是不夠的。項目中還是要引入ESlint。兩者配合才能使項目代碼優雅健壯

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

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

相關文章

  • 用VS Code開發Vue應用

    摘要：這是為什么呢因為我們雖然引入了，但是還沒有對做設置，我們在項目的根目錄下創建一個文件，然后在其中加入再次執行，現在我們看到已經能夠起作用了。摘要： 0錯誤0警告應該是每個程序員最基本的要求。 原文：用vscode開發vue應用 作者：張京 Fundebug經授權轉載，版權歸原作者所有。 現在用VSCode開發Vue.js應用幾乎已經是前端的標配了，但很多時候我們看到的代碼混亂不堪，作為一...

    zhaofeihao 評論0 收藏0

  • 在Typescript項目中，如何優雅的使用ESLint和Prettier

    摘要：對于項目的編碼規范而言，主要有兩種選擇和。此外由于性能問題，官方決定全面采用，甚至把倉庫作為測試平臺，而的解析器也成為獨立項目，專注解決雙方兼容性問題。最近在我的項目的編碼規范中全量的用代替了針對其中遇到的問題做一個記錄。 ??對于Typescript項目的編碼規范而言，主要有兩種選擇ESLint和TSLint。ESLint不僅能規范js代碼，通過配置解析器，也能規范TS代碼。此外由...

    chemzqm 評論0 收藏0

  • 在Typescript項目中，如何優雅的使用ESLint和Prettier

    摘要：對于項目的編碼規范而言，主要有兩種選擇和。此外由于性能問題，官方決定全面采用，甚至把倉庫作為測試平臺，而的解析器也成為獨立項目，專注解決雙方兼容性問題。最近在我的項目的編碼規范中全量的用代替了針對其中遇到的問題做一個記錄。 ??對于Typescript項目的編碼規范而言，主要有兩種選擇ESLint和TSLint。ESLint不僅能規范js代碼，通過配置解析器，也能規范TS代碼。此外由...

    WilsonLiu95 評論0 收藏0

  • 在Typescript項目中，如何優雅的使用ESLint和Prettier

    摘要：對于項目的編碼規范而言，主要有兩種選擇和。此外由于性能問題，官方決定全面采用，甚至把倉庫作為測試平臺，而的解析器也成為獨立項目，專注解決雙方兼容性問題。最近在我的項目的編碼規范中全量的用代替了針對其中遇到的問題做一個記錄。 ??對于Typescript項目的編碼規范而言，主要有兩種選擇ESLint和TSLint。ESLint不僅能規范js代碼，通過配置解析器，也能規范TS代碼。此外由...

    琛ｈ。 評論0 收藏0

  • 梳理前端開發使用eslint-prettier檢查和格式化代碼

    摘要：梳理前端開發使用檢查和格式化代碼問題痛點在團隊的項目開發過程中，代碼維護所占的時間比重往往大于新功能的開發。使用格式化所有代碼。參考文檔如何花分鐘解決產生的各種錯誤的記憶現場原文轉載梳理前端開發使用檢查和格式化代碼線上猛如虎，線下慫如鼠 梳理前端開發使用eslint-prettier檢查和格式化代碼 問題痛點 在團隊的項目開發過程中，代碼維護所占的時間比重往往大于新功能的開發。因此編...

    yangrd 評論0 收藏0

發表評論

0條評論

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