将 prettier 安装为 NPM 包和在 VS Code 中安装 prettier 扩展有什么区别

what is the difference between installing prettier as a NPM package and installing prettier extension in VS Code

我是网络编程的新手,我了解到我们可以键入 npm i -D prettier 将 prettier 安装为 devDependency 之一,并使用它来格式化我们的代码。然后我发现有一个 VS Code 扩展 Pretty 可以做完全相同的事情。

不知道两者有什么区别

如果只安装扩展,是否可以格式化没有安装prettier npm包的代码库?

这两者的配置过程是否不同?首选哪一个?

功能上没有区别,它们都可以工作。

VS 代码扩展 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. See the extension page's section on Prettier Resolution

我想用一个例子来说明为什么你可以在扩展上使用 npm。

假设您在一个团队中工作,并且您希望每个人都拥有相同版本的 prettier。通过 VS Code 扩展很难让每个人都使用相同的版本。开发人员必须自己管理版本控制,并且很难让所有人都使用同一版本(如果需要)。但是如果你使用 npm 并且在存储库中有 package.json/lock 文件,那么你可以很容易地使用相同的版本。如果您需要更新到相同的版本,您只需 npm install 即可,这将使每个人都在同一页面上。对于 prettier 来说它可能不是那么重要,但请考虑对最新版本进行重大更改的软件包。

所以回答你的问题:

If I only install the extension, can I format the codebase where the prettier npm package is not installed?

使用 VS Code 扩展时,您可以使用它来格式化任何文件。如果您没有在给定项目中安装 npm 包,扩展将使用其内置的默认包。

Also does the configuration process differ for these two? Which one is preferred?

两者都使用 .prettierrc 来表示您可以在 Prettier 中配置的(少量)内容。 VS Code 扩展附带了一些额外的配置,用于说明它应如何与您的编辑器交互。

如果您希望您的编辑器在保存时做 运行 更漂亮的事情,或者能够从 VS 代码命令面板 运行 它,您应该使用 VS 代码扩展。此外,如果你需要特定版本的 Prettier,或者你需要从命令行 运行 它,你可以将它作为 npm 包安装在你的 repo 中。这两个选项并不相互排斥。