问题标签 [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 回答
4986 浏览

typescript - 在 VSCode 中使用 Prettier 格式化打字稿?

现在,当我按 ctrl+shift+p 并选择格式文档时,代码的格式如下:

我希望它看起来像这样:

关于我可以翻转哪些开关的任何想法?我正在使用Prettier格式扩展。

0 投票
0 回答
1220 浏览

javascript - 单行函数体周围更漂亮的箭头括号

我正在使用 Prettier 和 AngularJs。我有这个小功能:

保存时,Prettier 在函数体周围添加括号:

我没有在设置中找到任何可以防止这种情况发生的东西,因此我们将不胜感激。谢谢你。

0 投票
2 回答
286 浏览

angular - 多次使用 enter 会增加代码的大小吗?

我正在使用Angular 4TypeScript开发一个项目。最近我看到一个关于 VSCODE 的视频可以做到这一点。我为此安装了prettier插件。并运行它以使代码看起来不错且可读。我也在脚本文件上做了同样的事情(即在 TS 文件上)。它所做的是让它可读,但代码行数增加了很多。

假设我写了一个输入

在我运行prettier输入后,单行 TS 代码变成了这样。

所以它需要 6 到 7 行代码。

这是否会增加文件大小,因为它进入一个类似于“ENTER”的新行?

我问这个是因为在此之后我在构建时遇到了一些内存错误。它是否也会增加我的页面内存大小,因为当我使用 chrome 开发工具通过堆快照进行检查时,几乎所有页面都在 40 到 50 MB 左右。

40 - 50 mb 页面大小

0 投票
1 回答
2106 浏览

eslint - 什么可能导致 eslint-plugin-prettier 在 CircleCI 上报告错误但在本地保持沉默?

我必须从 CircleCI 1.0 迁移到 2.0。在我将旧配置更改为新配置后,由于 eslint-plugin-prettier 报告了更漂亮的间距违规,构建失败。

MyProject - 是我的 GitHub 存储库,它包含一个文件夹client,其中包含我想在 CI 上构建的所有前端代码。文件夹中client

.eslintrc.json

.prettierrc

.gitattributes(我在 Windows 10 上工作)使用以下代码:

当然还有 package.json

在此处输入图像描述

新的 CircleCI 配置:

旧 CircleCI 配置:

由于 linting 问题,构建失败(都是关于空格的数量):

在此处输入图像描述

那么,什么可能导致这些错误?我在这里没有想法。我首先认为这可能是因为 .prettierrc 没有找到。但是,当我将它删除以进行实验并在本地运行时,我在所有文件中发现错误总数超过 1000 个。而在带有 .prettierrc 的 CI 上,少数文件中只有 188 个。

0 投票
1 回答
2518 浏览

javascript - 导入后设置更漂亮的空行?

我喜欢这样保持我的进口:

导入后有两个空行。Prettier 在导入后仅使用一个空行格式化 JS。如何将其设置为我想要的尽可能多的空白行?

0 投票
0 回答
508 浏览

javascript - 如何让 Google Tag Manager 中的双花括号更漂亮地识别为 JavaScript?

我使用 VS Code 编辑器prettier来格式化我的代码,但在 Google 跟踪代码管理器中,你用双花括号将变量包裹起来。例如,要在 Google 跟踪代码管理器中定义一个变量,您可以

这会导致问题,prettier因为它不是有效的 JavaScript 代码。我该怎么做才能prettier简单地将其视为一个变量?我愿意为此编写一个插件(如果可能的话),或者是否有某种我可以使用的配置等。任何帮助将不胜感激

编辑:我想prettier接受并格式化文件,就像普通的 JavaScript 一样。例如,我不想注释掉包含 GTM 变量的每一行代码,可以prettier简单地认识到说{{my_own_variable}}.map()my_own_variable.map()

0 投票
0 回答
54 浏览

javascript - 避免在 TypeScript / JavaScript 代码中删除“forEach”、“filter”等的换行符

我正在使用Prettier,总的来说,我喜欢它。

但是,我不同意一种类型的转换。假设我正在对数组进行一些转换,执行 a filter,forEach等。如果我手动编写它,我将按如下方式编写(真实代码示例):

请注意,我的每个“顶级”操作(filter, forEach)都在单独的行上,我认为这确实有助于提高可读性。

现在,使用 Prettier,它将.filter和结合.forEach在同一行:

我发现这对可读性有害,原因有两个:

  1. forEach快速阅读代码会迷失这种感觉。我无法从视觉上识别它。
  2. 主体部分forEach缩进了一层,const namespace = ...除非你仔细观察,否则在视觉上看不清楚是什么。

有什么办法可以防止这种情况发生(或者至少,一旦我决定这样安排,就可以防止 prettier 删除我在这些块上的手动格式)?我试图在options中搜索一些东西,但没有什么突出的。

谢谢!

0 投票
1 回答
4282 浏览

css - Prettier 不适用于 CSS

我刚刚在我的项目中实现了 ESLint 和 Prettier。JavaScript 文件的 Linting 可以完美运行。但是,对于 CSS 文件,添加缺少的分号之类的操作不起作用。Prettier 不是也应该支持 CSS 吗?

有没有人使用 Prettier 来格式化 CSS?

0 投票
0 回答
855 浏览

visual-studio-code - 如何配置 Prettier 格式化程序 - vscode 插件与安装的 npm 模块不一致

我正在使用 Prettier 1.14.0 和 Prettier Formatter for Visual Studio Code。我遇到了函数参数格式不稳定的问题。例如要求我保持字符串compose(field('tags'), orEmpty, commaList, usertag())()(user),内联,而第二个强制它是这样的

我希望两者都像第二种情况。它看起来parser不适用于 package.json ......这里有一些配置:

包.json

.eslintrc

.vscode/设置

我的插件

0 投票
0 回答
369 浏览

css - 更漂亮的 CSS - 保留空格

当我保存我的 css 文件时,Prettier 会删除空格,但我想在 css 选择器和修饰符之间保留空格。所以,我想要这个:

而不是这个:

如何在我的 .prettier.js 中覆盖这些设置?