這份代碼在保存時(shí)授滓，ESLint 會(huì)先從初始狀態(tài)變成正確的格式琳水，然后 prettier 又把代碼變成了錯(cuò)誤的格式。
以前當(dāng)我發(fā)現(xiàn)這個(gè)問題時(shí)般堆，我首先想的是把 prettier 規(guī)則配置的跟 ESLint 一致在孝，這樣就沒問題了。
然而 standard 規(guī)則要求函數(shù)名和括號(hào)之間有一個(gè)空格淮摔，這就是space-before-function-paren 規(guī)則（ESLint 本身也會(huì)默認(rèn)開啟這個(gè)規(guī)則）私沮。 但是 prettier 完全沒有這個(gè)規(guī)則！prettier 不會(huì)處理這個(gè)空格的問題和橙，所以根據(jù) ESLint 配置修改 prettier 規(guī)則不可行仔燕。
后來我找到的解決辦法是安裝 prettier-eslint 包。其實(shí)它一共所需的依賴如下：
npm i @vue/cli-plugin-eslint babel-eslint eslint eslint-plugin-vue prettier prettier-eslint --save-dev
如果在使用 vue-cli 創(chuàng)建項(xiàng)目時(shí)已經(jīng)選擇了 babel魔招、eslint晰搀，那么只需要安裝缺少的包：
npm i prettier prettier-eslint --save-dev
這樣，保存文件時(shí)會(huì)得到正確的代碼格式办斑。
那么 prettier-eslint 是怎么讓結(jié)果變得正確了呢外恕？昨天我去它的 github 看了看，原來它是先把代碼用 prettier 格式化，然后再用 ESLint fix鳞疲。
這和 vscode 保存文件時(shí)的流程是相反的罪郊。這樣等于是調(diào)轉(zhuǎn)了順序，最后我們只要 ESLint fix 的結(jié)果就行了建丧。
