问题标签 [prettier]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
5610 浏览

windows - 在 Windows 上运行更漂亮

我想在package.json.

阅读文档,建议使用cli执行以下操作

它适用于 mac / ubuntu,但在 Windows 上收到以下错误消息。

0 投票
2 回答
2158 浏览

prettier - 如何制作一个完全禁用 prettier 的 prettierrc 文件?

我正在编辑一个不使用Prettier的存储库,但我的编辑器(Emacs)prettier-js-mode基于文件扩展名加载。因此,当保存文件时,我会得到一堆我无法提交的空白更改,因为它会污染上游存储库。

到目前为止,我的想法是添加一个.prettierrc禁用 Prettier 的本地文件,然后将其添加到我的.git/config/exclude文件中,这样上游就不必知道它。

但是我该如何制作这样的文件呢?

在我的情况下,我希望在项目的根目录中有一个文件,该文件将禁用整个项目的 Prettier,但我也可以看到其他人可能希望如何为子目录做同样的事情。

0 投票
0 回答
21 浏览

node.js - 节点 - 脚本如何确定要调用的依赖项的位置?

我们正在开发npm package一个库,它将被包含在其他项目中。这个包有时必须运行一个 shell 脚本:它使用一些参数调用Prettier 。${somePath}/node_modules/prettier/bin/prettier.js

问题是,由于node_modules生成的方式,该prettier.js脚本的位置似乎无法得到保证。它可能直接在node_module包的文件夹下,例如:

或者它可以通过 npm 移动到根node_module文件夹:

我们的脚本必须知道它的位置.js才能调用它!推荐的定位方法是什么?

是否可以先检查 local node_modules,然后,如果prettier找不到,则检查 parentnode_modules等,直到找到包?这会是一个可靠的解决方案吗?

0 投票
1 回答
51 浏览

javascript - 如何在 VS code/Prettier 中为不同的文件指定不同的格式

有谁知道是否可以让 VS Code 以不同的方式自动格式化不同的文件扩展名?

例如我想要:

JS - 4 个空格,CSS - 2 个空格和 HTML - 2 个空格

0 投票
1 回答
1332 浏览

javascript - 我怎样才能告诉 prettier 只美化 --staged 文件?

我正在使用pretty-quick,但它美化了我所有的node_modules.

我做我想做的一切都变得更漂亮了。它美化了js, scss,并且只美化了我要求它做的文件。

现在我已经美化了所有文件,在未来的提交中,我只希望美化器在已进行更改的文件上运行。

pretty-quick 允许您运行--staged以仅美化具有更改的文件。

我怎样才能告诉 prettier 只美化--staged文件?

0 投票
4 回答
15908 浏览

formatting - EditorConfig vs. Eslint vs. Prettier:值得全部使用吗?

我正在尝试设置一些工具来帮助保持多个开发人员使用的代码库的一致性。有必要同时使用 EditorConfig、ESlint 和 Prettier 吗?据我了解,EditorConfig 用于设置编码样式/规则,ESlint 用于确保代码格式一致,如果代码不遵循规则则抛出警告,prettier 用于根据规则自动格式化代码。但是,我相信您可以在 prettier 中自定义规则,这反过来完成了 EditorConfig 的工作。这是真的?用于维护一致代码的最佳工具组合是什么?

0 投票
3 回答
14060 浏览

import - Tslint:更漂亮的不固定最大行长

我正在使用带有更漂亮的插件和打字稿以及 tslint 的 VSCode。

抛开使用这个配置的方便,我得到了一个

对于这样的一行:

我已经更漂亮地配置了 100 的打印宽度,所以我期待在Format Document这条线上会被重构为这样的东西:

或像这样:

但事实并非如此。任何想法为什么?

0 投票
2 回答
1268 浏览

javascript - 在 JetBrains WebStorm 中使用 node.js 文件观察器

几周以来,我一直在我的项目中使用 Prettier。我很喜欢!

我使用 JetBrains WebStorm IDE,所以我按照 Prettier 项目网站上的这些说明来了解如何在 WebStorm 中设置文件观察器:https ://prettier.io/docs/en/webstorm.html#using-file-watcher

然后,每次我保存 JavaScript 文件时,Prettier 都会自动在其上运行,WebStorm 会在 Prettier 保存文件后立即向我显示更改。

我希望团队中的每个人都使用 Prettier,但并不是每个人都使用 WebStorm。有些人使用 Prettier 不容易配置的编辑器。因此,我按照 Prettier 项目站点上的这些说明,了解如何在我的package.json文件中将文件观察程序设置为 npm 脚本:https ://prettier.io/docs/en/watching-files.html

按照文档中的建议,我将该onchange包用作我的文件观察器,并且我在 WebStorm 中禁用了文件观察器,因为我不需要 Prettier 连续运行两次。

问题是,当我在 WebStorm 中保存文件时,onchange程序包会正确运行 Prettier,但我看不到编辑器中的更改,即使我用鼠标光标退出然后返回文件窗口也是如此。当我尝试进行新更改并再次保存时,我从 WebStorm 收到此“文件缓存冲突”警告消息:“已对内存和磁盘进行更改。保留内存更改,显示差异,加载文件系统更改”

在此处输入图像描述

如果我选择“加载文件系统更改”,Prettier 保存的版本会成功加载。但是每次我保存时都必须看到这个对话框是很烦人的。如果更改自动反映在 WebStorm 中,我会更喜欢它。

似乎唯一的方法是改用 WebStorm 的内置文件观察器,但是我没有一种简单的方法来为我的同事设置 Prettier,而不强迫他们手动安装自己的独立解决方案。

所以我的问题是:如何使用通用 node.js 文件观察器作为 npm 脚本,在保存后对我的文件进行更改,并在没有此对话框的情况下在 WebStorm 中自动重新加载这些更改?

0 投票
7 回答
30532 浏览

typescript - Prettier 没有按规定缩进

Prettier 继续错误地格式化我的代码。我希望标签有 4 个空格(第二张图片),但它忽略了编辑器设置并执行 2 个(第一张图片)。

我知道这是更漂亮的原因,因为当我禁用它时,代码会为我正确缩进。不幸的是,prettier 的其他功能丢失了。我已经尝试卸载并重新安装。

那么,我缺少哪些设置更改?我肯定错过了什么。任何建议都会很棒。谢谢。

这是我更改的所有更漂亮的设置。

不正确

正确的

0 投票
1 回答
328 浏览

eslint - 如何防止 prettier 删除 eslint standardJS 注释?

StandardJS(基于 eslint)使用特殊注释,例如

这不能分解到下一行——即使是长类名。如何防止 prettier 将评论中断到下一行?