這個很有”主見“的代碼格式化工具 專治代碼潔癖！

來源丨開源最前線（ID：OpenSourceTop） 猿妹 編譯

鏈接：https://blog.reactnativecoach.com/format-code-style-with-prettier-in-react-native-1e10e6b7169f、https://medium.freecodecamp.org/why-robots-should-format-our-code-159fd06d17f7等

我曾經(jīng)認為擁有個人代碼風格對于程序員來說是一件好事，因為它證明你是一個成熟的開發(fā)人員。但是后來，我發(fā)現(xiàn)并不是這樣的，代碼格式化對一個項目團隊來說實在是太重要了，它使得整個項目的代碼變得更加美觀整潔，也更具有可讀性

今天，猿妹要和大家推薦一個很有”主見“的代碼格式化工具——Prettier

目前，Prettier在GitHub上已經(jīng)獲得 40.4K 個 Star，3K 個Fork。

GitHub地址：https://github.com/prettier/prettier

prettier官網(wǎng)：https://prettier.io/

Prettier入門很容易。我更喜歡使用npm或yarn將本地版本保存到我的項目中：

// npm
npm i --save-dev prettier
// yarn
yarn install --dev prettier

然后向 package.json 中添加一個腳本，目的是為了在項目上更好的運行本地的二進制文件。注意：對二進制大型對象（Blob）來說，引號的使用是非常重要的，這關系到能否更好地拓展

"scripts": {
  "prettier": "prettier 'src/**/*.js'"
}

你還需要修改腳本以匹配項目源文件

"prettier": {
  "jsxBracketSameLine": true,
  "semi": false,
  "singleQuote": true
}

此時，你應該可以通過npm運行Prettier，并查看它對項目作出的變化。

Prettier已經(jīng)被一些非常流行的項目比如React和Babel采用了，支持列表如下：

通過使用Prettier，相信你也會和我一樣發(fā)現(xiàn)它的這些優(yōu)點：

• 幾乎不需要做決定，因為Prettier的選項配置很少。

• 項目團隊無需為了一個特定的規(guī)則爭論不休

• 開發(fā)者不需要去學習項目的代碼風格。

• 不需要去修復ESLint報告的風格問題。

• 可在文件保存時自動統(tǒng)一風格。