javascript 为什么 Prettier 不在 VSCODE 中格式化代码?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/52586965/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-29 09:59:01  来源:igfitidea点击:

Why Prettier does not format code in VSCODE?

javascriptvue.jsvisual-studio-codenuxt.jsprettier

提问by Billal Begueradj

In my Nuxt application where ESlint and Prettier are installed and enabled, I switched to Visual Studio Code editor.

在安装并启用了 ESlint 和 Prettier 的 Nuxt 应用程序中,我切换到了 Visual Studio Code 编辑器。

When I open a .vuefile and press CMD+ Shift+ Pand choose Format Document, my file does not get formattedat all.

当我打开一个.vue文件并按CMD+ Shift+P并选择Format Document 时,我的文件根本没有被格式化

My .prettierrcsettings:

我的 .prettierrc设置

{
  "tabWidth": 2,
  "semi": false,
  "singleQuote": true
}

I have so many source code lines, I can not format them manually. What am I doing wrong?

我有很多源代码行,我无法手动格式化它们。我究竟做错了什么?

回答by FacePalm

Sometimes, prettier stops working when there are syntactic errors in the code. You can view the errors by clicking on the xbutton on the bottom right corner beside Prettier

有时,当代码中存在语法错误时,prettier 会停止工作。您可以通过单击Prettier旁边右下角的x按钮来查看错误

enter image description here

在此处输入图片说明

回答by Simin Maleki

Prettier could also format your files on save.

Prettier 还可以在保存时格式化您的文件。

However, installing and enabling does not result in working.

但是,安装和启用不会导致工作。

You have to check "format on Save" in VSCode: Setting >> User >> Text Editor >> Formatting

您必须在 VSCode 中检查“保存时的格式”:设置 >> 用户 >> 文本编辑器 >> 格式

enter image description here

在此处输入图片说明

回答by Miha

How I've sorted it after having super huge frustrations with Prettier stopping working in VSCode.

在对 Prettier 停止在 VSCode 中工作感到非常沮丧之后,我是如何对其进行排序的。

  1. Select VS Code-> View-> Command Palette, and type: Format Document With
  2. Then Configure Default Formatter...and then choose Prettier - Code formatter.
  1. 选择VS Code-> View-> Command Palette,然后输入:Format Document With
  2. 然后Configure Default Formatter...再选择Prettier - Code formatter

This sorted the problem for me magically.

这神奇地为我解决了问题。

Depending on your case this might help you...

根据您的情况,这可能会帮助您...

回答by Lucas

This is not a problem with Prettier itself, but prettier-vscode, the VSCode extension. According to its documentation, Vue formatting is disabled by default:

这不是prettier-vscodePrettier本身的问题,而是VSCode 扩展的问题。根据其文档,默认情况下禁用 Vue 格式化:

prettier.disableLanguages (default: ["vue"])

A list of languages IDs to disable this extension on. Restart required. Note: Disabling a language enabled in a parent folder will prevent formatting instead of letting any other formatter to run

prettier.disableLanguages(默认值:[“vue”])

禁用此扩展的语言 ID 列表。需要重新启动。注意:禁用父文件夹中启用的语言将阻止格式化而不是让任何其他格式化程序运行

In this case, to enable you should set "prettier.disableLanguages": []. And since this is an extension configuration, you should do it in VSCode settings file, not .prettierrc.

在这种情况下,要启用您应该设置"prettier.disableLanguages": []. 由于这是一个扩展配置,你应该在 VSCode 设置文件中进行,而不是.prettierrc.

回答by Devesh

1 .Use the other extension prettier was not working for me i just use the other VSCODE extension named PrettierNowi think this will help, done for me.Checkout the extension here

1 .使用另一个更漂亮的扩展名对我不起作用我只是使用另一个名为的 VSCODE 扩展PrettierNow我认为这会有所帮助,为我完成。在此处查看扩展程序

2 .From Latest Updates of prettier you need to add .prettierrcfile in your root of the projects if you want to stick with prettier. An example of .prettierrcis this-

2 .从最新更新的更漂亮.prettierrc,如果您想坚持使用更漂亮,您需要在项目的根目录中添加文件。一个例子.prettierrc是——

{
  "tabWidth": 4,
  "singleQuote": true,
  "semi": false
}

回答by Zenox

Enabling "format on Save" in VSCode: Setting >> User >> Text Editor >> Formattingworked for me!

在 VSCode 中启用“保存格式”:设置 >> 用户 >> 文本编辑器 >> 格式对我有用

Print

打印

回答by Alongkorn Chetasumon

can you try to add this section to your user setting file?

您可以尝试将此部分添加到您的用户设置文件中吗?

 "[javascript]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode",
        //   "editor.formatOnSave": true,
    },

回答by kartick shaw

Some times with auto plugins update Required files used by Prettier might go missing .

有时使用自动插件更新 Prettier 使用的必需文件可能会丢失。

Check this path if files are present here or folder is empty

如果此处存在文件或文件夹为空,请检查此路径

C:\Users\YOURUSERNAME\.vscode\extensions\esbenp.prettier-vscode-2.2.2\out

C:\Users\YOURUSERNAME\.vscode\extensions\esbenp.prettier-vscode-2.2.2\out

If missing uninstall and reinstall prettier

如果缺少卸载并重新安装更漂亮

回答by Ali Monapour

I Rolling back prettier to 1.7.3 and fixed it

我回滚更漂亮到 1.7.3 并修复它