webStrom 设置 Prettier 作为代码格式工具(其他jetbrains系列软件的也一样)

最新推荐文章于 2023-05-26 18:14:03 发布
最新推荐文章于 2023-05-26 18:14:03 发布
阅读量2.1k 收藏
点赞数 1
分类专栏： webstrom
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_42339350/article/details/114532979
版权
安装插件

在这里插入图片描述

安装依赖

更具自己项目需求选择安装方式

yarn add prettier
yarn add prettier -D
yarn global add prettier

设置路径
1 2020.2版本及以上的，webStrom集成了prettier。在设置中搜索，设置即可

在这里插入图片描述

打勾，且选择包的路径，然后使用webStrom格式化的时候就会自动使用prettier进行格式化而不是自身自带的

在这里插入图片描述

2 2020.2以下的版本 在代码文件中连续按下两次shift, 选择action ，搜索prettier,选择reformat with prettier 或者直接使用快捷键 ctrl+alt+shift+P。 当然该方法2020.2版本以上也能用

在这里插入图片描述

ttt唐老鸭
关注
专栏目录
VSCode与Prettier代码格式化工具的使用
彭世瑜的博客
07-16 1687
Prettier同时可以在浏览器中使用。格式化代码文件输出到命令行。也可以使用目录中的配置文件。格式化文件并覆盖现有文件。VS Code中安装插件。
vscode 使用Prettier插件格式化配置使用代码详解
10-14
Prettier是一个流行的代码格式化工具，它可以解析JavaScript的语法，并且将代码按照一定的规则进行格式化，使得代码更具有可读性。 在VSCode中使用Prettier插件可以实现代码的自动格式化，节省开发者的格式化代码...
prettier自动格式化去换行的实现代码
10-14
主要介绍了prettier自动格式化去换行的实现代码，本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
webstorm 自定义eslint格式化代码
SnowBeatRain的博客
09-13 8414
vscode上配置eslint格式化代码使用的Prettier 插件，一键格式化。 webstorm上的配置流程如下：https://blog.csdn.net/qq_29329037/article/details/80100450
固定代码格式化程序插件-Prettier JetBrains
weixin_30449239的博客
06-10 358
基本使用 使用npm install prettier --save-dev为您的项目添加更漂亮或全局安装 使用Prettier选择要格式化的代码或文件 使用“Reformat with Prettier”操作（在MacOS上使用Alt-Shift-Cmd-P或在Windows和Linux上使用Alt-Shift-Ctrl-P）或使用“查找操作”弹出窗口（Cmd / Ctrl-Shift...
webstorm格式化代码_提高前端开发效率—前端代码编辑器
weixin_39654751的博客
11-29 417
工欲善其事，必先利其器。但我最开始接触网页的时候，人们普遍认为能用记事本写HTML和CSS的才是大神，彼时也没有前端这一说法，随着网页越来越复杂用记事本的开发效率就太低了，这一篇主要介绍几种我现在还常用到的几款编辑器。但还是要说明一点，这些编辑器和IDE都只是写代码的工具而已，不一定要评个谁优谁劣，看到很多类似的争论感觉挺可笑的，就一个编辑器而言，有的人说他的优点云云，难道别的编辑器就没有吗，用的...
Webstorm 配置 Eslint + Prettier 统一团队代码风格
plan_jok的博客
03-15 699
添加链接描述
[效率提升]webstorm配置Prettier：代码自动格式，格式化时清除空行，修改使用代码模板
南北极之间
03-28 8686
全局安装prettier 配置：默认是没有包含Vue的，我们手动加上即可： 每次保存的时候，就会自动格式化了。
webstorm 中使用 Eslint+Prettier统一代码风格
fwzzzzz的博客
10-28 2097
nestjs
详解如何在vue项目中使用eslint+prettier格式化代码
10-17
而`prettier`则是一款代码格式化工具，它能够自动按照预设的规则对代码进行美化，包括括号、引号、缩进等细节，使得代码风格统一。 首先，确保你的项目已经安装了`vue-cli`，因为这通常是创建Vue项目的标准方式。接...
WebStorm最新版v2020.2新增修复功能（一）：采用Prettier作为默认格式化程序
qq_42444778的博客
07-28 1987
WebStorm 2020.2版本是WebStorm今年的第二个重大更新，现已发布！它将Prettier作为默认格式化程序选项，能够更好的支持Vue类，JavaScript，以及对GitHub pull请求的全面支持等等。 下载WebStorm2020.2最新试用版 如果您只有几分钟时间来探索WebStorm 2020.2的新增功能，请观看此视频。如果您想更深入地学习，请继续阅读！ 新功能和改进属于以下类别： **框架和技术：**使用Prettier作为默认格式化程序的选项，对Vue.js进行了
Webstom 代码格式化快捷键 使用项目中的Prettier
爱孔孟
05-26 1253
在现代的前端开发中，代码格式化是非常重要的一项工作，可以提高代码的可读性和可维护性。然后，在弹出的对话框中，勾选 Run on ‘Reformat Code’ action 复选框，这样每次通过快捷键执行代码格式化操作时，都会自动调用 Prettier 来进行格式化。我们可以使用默认模式，也可以按照官方文档中的说明进行自定义。总的来说，将 Prettier 设置为默认的格式化程序是非常有用的，可以帮助我们提高代码的可读性和可维护性，从而更加高效地进行前端开发工作。首先，我们需要在设置对话框中找到。
WebStorm设置前端开发代码规范
jonssonyan
07-13 2053
Prettier StyleLint ESLint TSLint
webstorm配置Prettier
ttxxsir的博客
09-21 2万+
Prettier是代码美化工具，配置到webstorm后，可以在你保存代码的时候，自动帮你美化代码，然后配合Eslint规则，爽得不要不要的，可以节省你大量的时间，美滋滋！~废话少说，上酸菜！ 一、准备工作 1、webstorm(2018.1及以上，直接去官网下载安装) 2、Prettier npm npm install --save-dev prettier # or global...
20220412 关于有严格格式化要求项目的代码提交 prettier插件使用 踩坑预警
weixin_44190736的博客
04-12 725
今天接手了一个有严格格式化代码需求的项目，因为这个项目之前有很多人在开发，所以对于提交的代码格式有所需求，第一次学习了有关于有严格格式化代码项目的一些知识。 1.项目中代码说明 有关于格式化代码要求的代码在这几个文件里 关于.prettier.js这个是跟格式化代码的插件prettier有关的，一般是自动生成，里面的内容一般是一致的。 关于commitlint.config.js此处要注意的是，commit的时候都要写文字的注释对该次代码的提交进行说明，所以提交的时候需要特定格式地写注释。如 upd:该次
webStrom安装和配置Prettier
Zeqin3333的博客
03-05 1281
1、安装webStrom 2、通过命令面板安装prettier。通过npm install -g prettier或者npm install --save-dev prettier来安装。 3、通过webStrom配置prettier。 进入设置页面，搜索file watchers。 点击右边的加号，找到Prettier，点击Prettier。 File type中选择任何文件，直接...
作为前端开发，我为何疯狂推荐WebStorm？
热门推荐
零一的博客
08-09 2万+
经常会有小伙伴过来私信我，让我给他们推荐一下前端开发工具，我几乎都是毫不犹豫地就说 " WebSotrm "，原因我当时也没给他们细讲，因为这款开发工具功能实在是太全了，一句两句说不清楚，所以我准备写一篇文章告诉大家为什么要选择WebStorm
prettier
besttoby01的博客
09-21 1736
保存一套prettier规则 { // 使能每一种语言默认格式化规则 "[html]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "[css]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "[less]": { "editor.defaultFormatter":
react代码格式化工具
最新发布
07-27
对于React代码格式化，有许多工具可供选择。其中一些流行的工具包括： 1. Prettier：Prettier是一个非常流行的代码格式化工具，支持多种编程语言，包括React。它可以自动格式化你的代码，并确保遵循一致的代码风格。 2. ESLint：ESLint是一个可扩展的JavaScript和React代码检查工具。除了检查常见的代码错误和潜在的问题外，它还可以用来格式化代码。你可以配置ESLint来使用一些规则和插件来规范你的React代码风格。 3. VS Code插件：如果你使用Visual Studio Code作为你的开发环境，有一些插件可以帮助你格式化React代码。例如，"Prettier - Code formatter"插件可以与Prettier集成，自动格式化你的代码。 这些工具都可以帮助你保持React代码的一致性和可读性。你可以尝试它们并选择最适合你的工作流程的工具。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值