logo标签列表

如何在 Visual Studio Code 项目中格式化所有文件？

visual-studio-codeformatting
277
有没有一种方法可以在不逐个格式化每个文件的情况下，格式化整个项目中的所有文件？
14个回答
235
完成了大约一半，然后出现了“在运行格式化文件时发生错误：无效的计数值”的错误。 - Aaron Franke
21
因为它不使用 prettier，这导致我的所有文件都被破坏了。它会破坏 JSX 代码，请不要做这件事！你会后悔的。 - SweetFeet
19
@jake_314: 很抱歉你有这样糟糕的经历。但我希望在执行重要的脚本代码更改操作之前，你已经使用了Git或备份了你的代码？无论如何，我没有尝试过在JSX中使用它，但是这里有一个链接可能会有所帮助：https://www.rockyourcode.com/format-and-fix-all-files-with-prettier-and-es-lint-recursively/ - Stellan Lindell
4
值得关注这个扩展的排除项设置。它试图格式化我的整个node_modules文件夹，但除此之外似乎工作良好。 - Liam
2
或者右键单击文件夹，然后点击“开始格式化此文件夹”。 - Shalabyer
非常感谢，对于C/C++项目来说，它的效果非常好。正如其他人指出的那样，请注意排除的文件夹和文件列表。该扩展在实际重新格式化之前列出了它想要重新格式化的内容，因此您可以在真正采取任何行动之前对排除项进行彻底的调整和测试。当然，首先要备份您的项目。 - undefined
151

这对我有用

安装prettier：

npm init 
npm i -D prettier
在 package.json 文件中添加以下 script：
"pretty": "prettier --write \"./**/*.{js,jsx,ts,tsx,json}\""

只有在这种情况下，我需要格式化我的 .js、.jsx 和 .json 文件。

运行脚本：

npm run pretty
26
可能需要在npm install命令中添加“--save-dev”，因为生产环境中不需要此依赖。 - reggaeguitar
14
假设这个问题是关于 JavaScript 的。但我没看到任何相关的标签。 - Emobe
2
如果您同时使用eslint和prettier，您也可以使用eslint --fix。 - LucasBordeau
1
我同意这个答案应该被踩。当时我在寻找这个问题的答案时，主要是在处理js/jsx/json代码。 - Hieu Thai
2
VSCode 不仅适用于 Node.js。这个问题是关于所有代码文件的通用格式。 - Ramesh-X
显示剩余7条评论
67

我发现最简单的解决方案如下：

  • 在vscode中安装prettier。
  • 创建.prettierrc文件并按照您的需求进行配置。
  • 在vscode控制台中运行以下命令：

npx prettier --write "**/*.ts" （根据需要添加文件类型正则表达式）

2
这仅适用于js代码，问题并没有询问有关js的内容，而是在谈论一般的格式。 - Jason Axelson
1
你可以更改正则表达式来格式化 prettier 支持的文件。由于问题有 JavaScript 标签，大多数答案包括 js、ts、jsx 等。 - Piyush Balapure
1
Javascript标签是后来添加的，人们只是认为它是用于Javascript的，然后编辑器添加了该标签。 - Jimmar
45
3
是的，我喜欢这个！与C++很好地配合使用。 - Aaron B.
1
请大家都安装并点赞这个扩展！对于需要在 VS Code 中使用设置进行重新格式化的大型项目而言，这个扩展非常重要，特别是在容器化环境中运行时，控制台命令行可能具有不同的格式化程序设置。 - Dan Nissenbaum
1
这就是答案！ - Nonoroazoro
1
五年没有对这个项目做出承诺。但它仍然运行良好！ - Marcel
1
只是需要并发现它正在运作中...已经有131,113次安装并且还在继续增加...请将此视为答案接受... - Muhammad Hassan
41

如果您的语言受支持，使用 npm ，在终端中只需运行npx prettier --write .

1
这是最好的答案，涉及到 prettier，因为这就是 prettier 文档 上建议的做法。 - benmneb
13

您可以使用扩展程序 Command on All Files

将其添加到您的 settings.json 中

"commandOnAllFiles.commands": {
    "Format File": {
      "command": "editor.action.formatDocument",
      "includeFileExtensions": [".js",".ts",".css"]
    }
  }

从命令面板中选择命令将1个或多个命令应用于工作区中的所有文件，并从快速选择列表中选择格式化文件。等待直到您看到一个信息消息（右下角），表明所有文件都已被处理。

2
谢谢！这个很好用。顺便说一下，我注意到你的用户名和扩展作者的非常相似。如果你是扩展作者，你可能想要添加一个免责声明。这只是良好的礼仪 :) - ADTC
2
@ADTC 是的，这是同一个人，我使用了SQLite方法，没有提到任何名称。 - rioV8
3
11
如果你的项目有三千多个文件怎么办？这对于小型项目可能没问题，但不适用于一般建议。 - LucasBordeau
1

如果您想格式化特定文件夹，只需移动该文件夹并运行命令npx prettier --write .

例如：如果您在'xyz/frontend'文件夹中，那么里面的所有文件都将被格式化。同样，如果您只想格式化前端项目下的src文件夹，则通过cd src进入src，然后运行命令npx prettier --write .，这将仅格式化src内部的文件。

0

VSCode Workspace Formatter

我推荐使用VSCode Workspace Formatter。刚刚对一个包含几百个源代码文件的子目录进行了格式化，效果非常好。
  • 该扩展自动化了打开+格式化+保存的步骤。
  • 应用了VSCode的格式化设置，包括格式化扩展。
  • 可以对工作区或子目录进行格式化（在文件树中右键单击）。
  • 可配置的包含/排除路径模式。
  • 可在{{link3:Open VSX和VSCodium中使用}}。

请参见

0
如 @herrbischoff 所说，目前没有办法格式化项目中的所有文件。
不过这将是一个有用的功能。

它可以通过自动保存和自动格式化来格式化所有未保存的文件。

否则，您需要一个 shell 脚本或扩展程序或其他外部程序（例如能够自动更正错误的 tslint 检查器）来完成此操作。

我自己也遇到了这个问题，手动打开所有文件很让人头疼。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接