將 prettier 安裝為 NPM package 和在 VS Code 中安裝 prettier 擴展有什么區別

Question

我是 web 編程的新手，我了解到我們可以輸入npm i -D prettier來安裝 prettier 作為devDependency之一，並使用它來格式化我們的代碼。 然后我發現有一個 VS Code 擴展 Pretty 可以做完全相同的事情。

我不知道兩者之間有什么區別。

如果我只安裝擴展，我可以格式化沒有安裝更漂亮的 npm package 的代碼庫嗎？

這兩者的配置過程也不同嗎？ 哪個是首選？

Answer 1

在功能上沒有區別，它們都可以工作。

The VS Code extension Prettier (not Pretty Formatter, that's different) includes a recent copy of the prettier npm package inside it, which it will use by default if you don't have the package installed via npm in your repo. 請參閱擴展頁面的Prettier Resolution部分。

我想用一個例子來說明為什么你可以在擴展上使用 npm。

假設您在一個團隊中工作，並且希望每個人都擁有相同版本的更漂亮。 通過 VS Code 擴展讓每個人都使用相同的版本是相當困難的。 開發人員必須自己管理版本控制，並且很難全部使用相同的版本（如果需要）。 但是，如果您使用 npm 並在存儲庫中擁有 package.json/lock 文件，那么您都可以輕松地使用相同的版本。 如果您需要更新到相同的版本，您只需npm install ，這將使每個人都在同一頁面上。 對 prettier 來說可能不是那么重要，但請考慮對最新版本進行重大更改的軟件包。

所以回答你的問題：

如果我只安裝擴展，我可以格式化沒有安裝更漂亮的 npm package 的代碼庫嗎？

使用 VS Code 擴展時，您可以使用它來格式化任何文件。 如果您沒有在給定項目中安裝 npm package，則擴展將使用其內置的默認 package。

這兩者的配置過程也不同嗎？ 哪個是首選？

兩者都使用.prettierrc來處理您可以在 Prettier 中配置的（少量）內容。 VS Code 擴展附帶了一些額外的配置，用於說明它應該如何與您的編輯器交互。

如果你想讓你的編輯器在保存時運行更漂亮，或者能夠從 VS Code 命令面板運行它，你應該使用 VS Code 擴展。 此外，如果您需要特定版本的 Prettier，或者您需要從命令行運行它，您可以將其安裝為 npm package 在您的存儲庫中。 這兩個選項並不相互排斥。