prettier的使用

最新推荐文章于 2024-04-25 22:45:58 发布
最新推荐文章于 2024-04-25 22:45:58 发布
阅读量1.2k 收藏 2
点赞数
文章标签： javascript 前端 npm
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/bbt953/article/details/130869111
版权

1、vscode要安装prettier插件

2、vscode插件安装完后，要设置Format on save，保存时自动格式化
在这里插入图片描述
3、项目也要安装prettier插件
npm i --save-dev prettier

4、在项目根目录下新建.prettierrc.json文件

5、看prettier配置这边文章，里面详细记录了各种配置，粘贴过来使用，可根据项目需要进行修改

6、如果保存时，代码没有被格式化成prettier定义的样式，右键——使用…格式化文档——选择prettier code formater
在这里插入图片描述
在这里插入图片描述

湛海不过深蓝
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在VScode中配置ESLint和prettier插件
酷爱前端的小陈博客
05-04 9009
1、ESLint工具介绍 可组装的JavaScript和JSX检查工具 用来团队开发整顿代码的风格（例如代码后面是否加“ ；”，代码前使用4个空格，还是两个空格或是一个Tab键） 使用方法查阅官方网址 ESLint官方文档http://eslint.cn/ 2、在VScode中配置ESLint工具 首先在VScode中搜索tabsize 在VScode中搜索format 3、创建带有ESLint工具 的Vue项目 找到需要创建项目的根目录 ......
prettier 使用详细介绍
qq_42880714的博客
05-20 4837
prettier 使用详细介绍
配置prettier
a1071626267的博客
10-26 1万+
配置prettier
前端项目中使用插件prettier/jscodeshift/json-stringify-pretty-compact格式化代码或json数据
最新发布
关注前端，关注原创
04-25 1213
平时遇到json、vue、css代码格式化，图片与base64互转、图片格式转换等操作时，都是找在线工具，有些工具做的还挺好，有些做的那一坨，一坨的排名还靠前……找几个在线工具都不好，终于忍不了，准备做一个自己的chrome/edge插件，方便以后开发时便捷操作。先从代码格式化开始。后续再把monaco集成进来，完成代码显示部分，demo先用输入框将就一下。
什么是Prettier？
LizequaNNN的博客
09-08 4849
什么是Prettier？ 一、介绍Prettier Prettier 的原理非常简单，不管你写的代码是个什么鬼样子，Prettier 会去掉你代码里的所有样式风格，然后用统一固定的格式重新输出。 1.1 代码格式化（An opinionated code formatter） 官方首先告诉你，Prettier 是一个 Opinionated 的代码格式化工具。Prettier 说自己是一个 Opinionated code formatter，就是说：你必须认同我的观点，按照我说的做。且在很多地方，你都可
一分钟带你快速了解Prettier+配置指南
tangdou369098655的博客
09-16 3920
prettier是一个代码格式化工具，它可以支持JS/JSX/TS/Flow/JSON/CSS/LESS等文件格式。
next-template:NEXT.js模板； 使用ESlint和Airbnb代码样式的Prettier使用了多个上下文和多个Reducer
03-05
多个上下文和多减速器使用更漂亮与ESlint和制作的Airbnb代码风格 下一个模板的功能 在此项目中将Next.js与多个（Context + Reducer）一起使用 使用带有自定义挂钩的本地存储 自定义浅色/深色主题（默认系统主题） ...
prettier-java:漂亮的Java插件
04-28
更漂亮的Java介绍漂亮的是一个自以为是...子包该项目包含2个软件包： 的插件，用于格式化Java代码 一个Java分析器使用，其输出一个C oncrete小号yntaxŤREE安装前提条件节点版本10+ 更漂亮 安装Prettier和Prettier-Jav
prettier-config:可重用的漂亮配置
03-29
:check_mark_button: 更新了漂亮的v2设置使用npx 运行以下命令以安装和配置更漂亮npx @eliasnorrby/prettier-config 这将运行一个安装脚本，加入这个包devDependencies ，写配置到prettier.config.js和写一些默认....
eslint prettier代码整合.docx
06-24
使用 ESLint-plugin-prettier 可以将 Prettier 的格式化结果与 ESLint 的检查结果集成起来，而使用 prettier-eslint-cli 可以先执行 Prettier 的格式化，然后再使用 ESLint 来检查代码的质量。无论使用哪种方法，都...
vs离线Prettier包
07-01
离线模式下，先安装JavaScript_Prettier_v2.0.33.vsix，然后将下载的rar文件解压缩到C:\Users\用户\AppData\Local\Temp路径下即可
一文了解prettier
qq_53114797的博客
01-25 1028
Prettier 是一个武断的代码格式化工具，为什么说它武断呢，因为它不负责代码检查，只负责按它自己的一套规则进行格式化。而且它的格式化可配置项也很少，上手很简单。（不过实际用下来格式化的效果很不错）JSXAngularVueFlowTypeScriptHTMLJSONGraphQLYAML为什么需要？
VsCode配置Eslint+Prettier结合使用详细配置步骤，规范化开发
知之为知之，不知为不知
08-20 1万+
vsCode配置Eslint + Prettier结合使用详细配置步骤，规范化开发
vscode + prettier 专治代码洁癖
热门推荐
悦涵仙子的技术笔记本
07-27 6万+
前言 相信很多小伙伴都纠结过自己代码的格式化问题，特别是团队协作的时候，加上前端语言种类繁杂，各种语法糖+团队个人的敲码习惯，会让你感觉到一团糟。 在过往，我们尝试过很多方式，从EditorConfig到各种***Lint, 还要研究各种配置，还是没办法满足我们的需求。 现在，prettier帮到你。 介绍 prettier是一个比较武断的格式化工具（官方介绍的逗比级...
VScode使用Prettier格式化代码
扛麻袋的少年的博客
04-01 1569
vscode使用prettier进行格式化
vscode插件Prettier使用 + 实现格式化时（默认双引号变为单引号）
weixin_53630395的博客
08-10 3171
vscode插件Prettier使用 + 实现格式化时（默认双引号变为单引号）
在VSCode中 使用 ESLint + Prettier检查代码规范及自动格式化前端Vue代码
全栈程序猿的专栏
02-11 2437
简而言之，Prettier的代码格式化功能比ESLint更强大，配置更简单，通过配置，ESLint可以使用Prettier的代码规则进行校验，如果不配置好，会出现冲突，导致二者不能配合使用。3、在 VSCode中插件安装中搜索 ESLint、Prettier - Code formatter、Vetur(因为Prettier不能格式化vue文件的template，所以使用Vetur)、这三个插件并安装。.eslintrc.js：代码检查规则的配置文件。.prettierrc：代码格式化的配置文件。
Prettier看这一篇就行了
zz_jesse的博客
07-28 713
点击上方关注前端技术江湖，一起学习，天天进步作者：陈龙https://zhuanlan.zhihu.com/p/81764012已获取作者授权，请勿未经允许转载。0.前言用了两年 Pre...
项目格式化插件 prettier
weixin_45044818的博客
04-01 641
说明 在写项目的时候，缩进，引号，空格等大家的规范都不太一致，为了统一这个规范，可以使用一个自动格式化的插件-------prettier。 使用步骤 1.在vscoe中安装prettier插件 2.在项目的根目录导入prettier的配置文件，文件为.prettierrc { "semi": false, // 是否使用分号，默认为true "singleQuote": true, // 是否使用单引号，默认为false "trailingComma": "none" // 行尾逗号 }
webstrom 自动格式化插件Prettier使用方法
04-09
Prettier是一款自动格式化插件，可以帮助你快速整理代码格式，提高开发效率。使用方法如下： 1. 首先，你需要安装Prettier插件。在WebStorm中，你可以通过以下步骤安装插件：File -> Settings -> Plugins -> 搜索...

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值