prettier配置項說明

Prettier

特點

• 一鍵改變代碼風格，無需改變開發風格

=> 1. 安裝Node 環境

• 自行安裝

=> 2. 安裝 Prettier

• 全局安裝
  npm install --global prettier
• 局部安裝
  npm install --save-dev --save-exact prettier

=> 3. 添加.prettierrc 配置文件(項目根目錄)

• 創建文件（可以自定義其他名稱）
  touch .prettierrc

=> 4. 修改.prettierrc 配置文件

• prettierrc 配置文件支持三種格式
  • JSON：

        {
          "printWidth": 100,
          "parser": "flow"
        }
    

  • JS：

        // .prettierrc.js
        module.exports = {
          printWidth: 100,
          parser: "flow"
        }
    

  • YAML：

        {
          "printWidth": 100,
          "parser": "flow"
        }
    

==> 5. 自定義配置

• 官網Options

• 部分配置

    .prettierrc  // js 格式 -- 方便備注
   export.modules = {
      "semi": false,                // 句末加分號
      "singleQuote": true,          // 用單引號
      "bracketSpacing": true        // 對象&數組是否追加空格
    }

==> 6. 運行

• 執行格式化
  prettier --config 配置位置 --write 需要格式化的文件
• 基礎用法
  prettier --config ./.prettierrc --write ./index.js
• 擴展用法（自定義文件配置以及格式化vue文件）
  prettier --config ./pre.js --write ./index.vue

==> 7. 結合Eslint 使用

更新中

 

 

6人點贊

 

日記本

 

 

"

作者：Piszz
鏈接：https://www.jianshu.com/p/5f7dbffc257e
來源：簡書
著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。