vscode+prettier配置保存自动格式化

最新推荐文章于 2024-04-27 14:02:43 发布
最新推荐文章于 2024-04-27 14:02:43 发布
阅读量8.5k 收藏 33
点赞数 10
文章标签： vscode 编辑器 ide
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/s2422617864/article/details/122534362
版权
  1. 安装prettier插件（应用商店中直接下载即可）-如图版本及以后均可 之前的版本不清楚可行否
    在这里插入图片描述
  2. 开始配置
    第一步，先打开vscode软件，左下角点击设置 》打开设置》唤出快速搜索条界面。
    第二步，接下来先设定自动保存文件，搜索框贴入files.autoSave筛出设置项，并把设置项属性选择为onFocuschange。
    第三步，设定编辑器默认代码格式化（美化）的插件为Prettier，同理在搜索设置框贴入editor.defaultFormatter，将配置项选择为Prettier。
    第四步，设定Prettier插件保存时自动格式化代码，搜索设置项贴入editor.formatOnSave，将搜索到的项目打钩即可
火腿肠烧烤大赛冠军
关注
  • 10
    点赞
  • 踩
  • 33
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
vscode 使用Prettier插件格式化配置使用代码详解
11-19
参考 使用ESLint+Prettier来统一前端代码风格 vscode 配置vue+vetur+eslint+prettier自动格式化功能 问题描述 最近用Nodejs + express 写了一个zip文件上传的功能，代码给了别人看，各种吐槽，代码不规范，没有按照eslint，编辑器打开就是各种红色提醒，当然还有其他许多… 第一反应就是反感，后面冷静一想，还是自己做事的态度有问题，做完了功能已经完成了95%，为什么不到最后一步一键格式化，做到百分百呢？反思中 为了让以后代码美观，不让别人吐槽，自己整理了vscode + prettier 1.使用vscode 安装 prett
prettier自动格式化去换行的实现代码
10-14
主要介绍了prettier自动格式化去换行的实现代码，本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
VScode保存自动格式化
m0_71349739的博客
03-01 1476
这样，您就成功取消了在VS Code中保存时自动格式化的功能。这个设置可以帮助您在编写代码时更加自由地控制代码格式，适应个人的编码习惯。如果您需要重新启用自动格式化功能，只需回到设置界面，勾选"Editor: Format On Save"选项即可。
【webstorm Prettier + eslint自动保存配置】
qq_43209807的博客
10-04 4070
有的版本Webstorm已经自带了Eslint、Prettier插件，如果没有就去File | Settings | Plugins添加相关插件。本文使用Vue cli创建项目，并做简单配置，暂时只有webstorm配置，本文的基础是在已经有eslint的基础上，新增prettier。去代码里面修改，按ctrl + s 保存时会自动格式代码。如果没有格式化，就把webstorm的自动保存去掉。我的版本是2021.3.3。
prettier 使用详细介绍
qq_42880714的博客
05-20 4605
prettier 使用详细介绍
配置 Prettier保存文件自动格式化代码不生效
weixin_43794749的博客
02-21 1490
项目根目录配置了.prettier.json文件但是保存代码时未生效 vscode
prettier+ts+eslint+vscode配置代码保存自动格式化,自动remove unsed declaration,delete no-unused-imports
tangdou369098655的博客
07-11 3036
准备工作 项目至少安装ESLint插件项目里有这些依赖 安装vue插件 提供vue代码片段、语法支持、代码高亮等，可以格式化html、标准css（有分号 、大括号的那种）、标准js（有分号 、双引号的那种）、vue文件 安装prettier插件 Code formatter 各种代码格式化，只关注格式化，并不具有eslint检查语法等能力，只关心格式化文件(最大长度、混合标签和空格、引用样式等)，包括JavaScript · Flow · TypeScript · CSS · SCSS · Less ·
解决：.prettierrc 配置完后，自动保存并没有格式化代码
Curry_On的博客
07-16 976
这个时候再 ctrl s 保存后，代码就已经按照配置的要求进行格式化了：双引号变成了单引号，分号去掉了。然后选择 configure default formatter…那么可以试下我的解决方法，很简单：鼠标右键，选择。然后选择 prettier 即可。问题解决，特此记录，希望能帮到你。
VS Code保存后Prettier自动格式化代码
juse__we的博客
12-07 2430
VS Code保存后Prettier自动格式化代码
prettier保存代码时自动格式化
Gleason
03-22 4727
打开vscode 在商店中搜索 prettier 并安装 打开 设置 搜索 Format 并勾选 Format On Save 设置 窗口失去焦点自动保存并格式化 设置默认格式化程序 任意打开一个js文件单击右键调出菜单选择使用...格式化文档 选择 配置默认格式化程序 选择 prettier 配置完成 ...
vscode使用prettier格式化代码不起作用、配置不生效的解决方法
热门推荐
云帆的博客
04-02 6万+
问题描述 在某一次更新prettier插件后，发现格式化不起作用了，在vscode用户配置中怎么设置都没有效果 解决方法 由于prettier插件优先使用项目根目录下的editorconfig配置文件，所以在vscode中怎么配置有没有用，如下图 进入插件配置界面 取消Use Editor Config的复选框，这样就不会优先使用editorconfig配置文件了 你可以在项目根目录创建一个.prettierrc.js配置文件，prettier会自动检测到，也可以手动配置 也可以使用vscode
vue+ESLint 配置保存 自动格式化代码
11-21
1. 在.eslintrc.js 添加 vscode 终端启动服务 // 添加⾃定义规则 'prettier/prettier': [ // eslint校验不成功后，error或2则报错，warn或1则警告，off或0则⽆提示 'error', { singleQuote: true, semi: false, //结束是否加分号 printWidth: 160//每行最长字符 } ] 2.打开VS code 文件》首选项》设置》扩展》ESLint》 // eslint格式化字符串 "editor.codeActionsOnSave": { "
详解如何在vue项目中使用eslint+prettier格式化代码
10-17
在开发中我们需要一种能够统一团队代码风格的工具，作为强制性的规范，统一整个项目的代码风格，这篇文章主要介绍了详解如何在vue项目中使用eslint+prettier格式化代码，需要的朋友可以参考下
vscode 配置vue+vetur+eslint+prettier自动格式化功能
10-15
主要介绍了vscode 配置vue+vetur+eslint+prettier自动格式化功能，本文通过实例代码图文的形式给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
vscode配置pretter，保存不自动生效的解决方法
梦若在心就在的博客
11-23 277
修改配置如下。
基于vscode的c++开发(Windows)
weixin_45111135的博客
04-24 769
链接器将各个目标文件中的符号引用解析为实际的内存地址，并且将程序所需要的库文件链接到最终的可执行文件中。语法： add_library(libname [SHARED|STATIC|MODULE] [EXCLUDE_FROM_ALL]语法： add_subdirectory(source_dir [binary_dir] [EXCLUDE_FROM_ALL])GCC编译器支持编译go、c、c++等语言。语法： ： project(projectname [CXX] [C] [Java])
【工具】-根源上解决VScode打印输出乱码的问题
w384829981的博客
04-26 450
你要想办法第一步把这里改成一致，UTF-8或者GBK都行，反正改成一致，(不改的话就要手动在命令窗口输入编译命令，异常繁琐)，这个编译命令如何改，一般和你的配置文件有关，其中基本在这两个地方，在。中的就不起作用了，至少在编译阶段是不起作用的；中配置文件如下：这里在编译阶段不起作用。
VSCode SSH连接远程主机失败，显示Server status check failed - waiting and retrying
最新发布
kitesxian的博客
04-27 338
vscode ssh连接不上远程主机
vscode中jsconfig.json文件首行提示错误
liweiweili126的博客
04-25 274
在使用react框架开发前端时，文件jsconfig.json首行提示错误，打开设置，勾选如下图这项。
vscode + prettier settings文件好用的配置
05-11
以下是我个人常用的 VS Code 和 Prettier 的配置： 1. VS Code 配置： ``` { "editor.formatOnSave": true, "files.insertFinalNewline": true, "files.trimTrailingWhitespace": true, "editor.tabSize": 2, "editor.wordWrap": "on", "editor.wordWrapColumn": 80, "editor.renderWhitespace": "boundary", "workbench.editor.enablePreview": false, "workbench.editor.enablePreviewFromQuickOpen": false } ``` 解释： - `editor.formatOnSave`：保存文件时自动格式化代码 - `files.insertFinalNewline`：文件末尾添加一个空行 - `files.trimTrailingWhitespace`：删除每行末尾的空格 - `editor.tabSize`：制表符宽度为两个空格 - `editor.wordWrap`：自动换行 - `editor.wordWrapColumn`：每行最大字符数为 80 个字符 - `editor.renderWhitespace`：显示空格和制表符 - `workbench.editor.enablePreview`：禁用文件预览 - `workbench.editor.enablePreviewFromQuickOpen`：禁用快速打开文件预览功能 2. Prettier 配置： ``` { "singleQuote": true, "trailingComma": "all", "printWidth": 80, "tabWidth": 2, "semi": false } ``` 解释： - `singleQuote`：使用单引号而不是双引号 - `trailingComma`：在对象和数组最后一个元素后添加逗号 - `printWidth`：每行最多 80 个字符 - `tabWidth`：制表符宽度为两个空格 - `semi`：不使用分号作为语句结束符 以上是我个人常用的配置，你可以根据自己的需求进行修改。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值