使用vcode下载安装 Prettier - Code formatter(要启用该插件)
然后还要 设置 vcode 编辑器的 默认格式化 为 Prettierxxx ,
操作步骤: 在vcode 中,按下 ctrl+shift+p 出现弹框,然后点击 箭头指向的 项

然后出现下面图片所示, 点击 配置格式化程序

然后出现 可以选择的 格式化文档 – 这里我们要选择 箭头所指的项

然后 建立 .prettierrc 文件,在里面配置自己的代码格式
– 配置后重新启动项目,才会生效

{//每行最多多少个字符换行"printWidth": 100, // tab缩进大小,默认为2"tabWidth": 4,// 使用tab缩进,默认false"useTabs": false,// 使用分号, 默认true"semi": false,// 使用单引号, 默认false(在jsx中配置无效, 默认都是双引号)"singleQuote": false,// 行尾逗号,默认none,可选 none|es5|all// es5 包括es5中的数组、对象// all 包括函数对象等所有可选"TrailingCooma": "all",// 对象中的空格 默认true// true: { foo: bar }// false: {foo: bar}"bracketSpacing": true,// JSX标签闭合位置 默认false// false: <div//          className=""//          style={{}}//       >// true: <div//          className=""//          style={{}} >"jsxBracketSameLine": false,// 箭头函数参数括号 默认avoid 可选 avoid| always// avoid 能省略括号的时候就省略 例如x => x// always 总是有括号"arrowParens": "avoid"
}

vue .prettierrc文件常见配置, 以及配置 Prettier - Code formatter 插件 格式化相关推荐

  1. VSCode中的Prettier - Code formatter插件配置

    一.Prettier - Code formatter 文件配置 settings.json文件 参考文章@前端烂笔头 参考文章@m0_57617148 关闭eslint语法报错: 参考文章@钢镚儿吖 ...

  2. Vs Code中Vue代码格式插件,Vetur、ESLint 、Prettier - Code formatter的介绍使用及相关配置

    文章目录 一.插件的介绍与安装 1.Vetur插件 2.ESLint 插件 3.Prettier - Code formatter插件 二.相关文件配置 总结 前面主要先对插件进行介绍和如何安装,之后 ...

  3. 前端代码规范速成 prettier - code formatter

    在vscode编译器中搜索并安装prettier - code 安装完成后在项目的根目录会多一个.prettierrc.js文件, 在这个文件里面可以配置代码规则,如果你新建了一项目,没有这个文件,可 ...

  4. vscode配置ESLint+Prettier - Code formatter+Vetur

    首先是安装ESLint+prettier+vetur: vscode 搜索安装即可,然后是注意package是否有这些: 没有的话npm安装. 之后就是配置这个文件: module.exports = ...

  5. java code formatter_IDEA插件配置之Eclipse Code Formatter

    Eclipse.Intellij idea格式化结果不一样,导致长时间都是用两个开发工具,idea开发eclipse进行格式化.但是现在这个问题可以解决了.使用Eclipse Code Formatt ...

  6. java code formatter,Eclipse Code Formatter在IDEA中配置

    硬盘安装:Setting =>Plugins=>Install plugin from disk,选中下载前往下载好的安装包[EclipseFormatter.zip]安装,重启后生效: ...

  7. vscode中如何修改vetur配置_vscode 配置vue+vetur+eslint+prettier自动格式化功能

    该配置用于vue开发,最终效果是保存时自动根据eslint对js.html和css代码进行格式化. vscode Vetur插件 Vetur插件用于识别vue文件,原本vetur自带格式化功能,但是和 ...

  8. VSCode环境下配置ESLint 对Vue单文件的检测

    本文介绍了在VSCode环境下如何配置eslint进行代码检查,并介绍了如何对.vue单文件进行支持. ESLint 安装 1.在工程根目录下,安装eslint及初始化 $ npm install e ...

  9. Vue 单文件组件||Vue 单文件组件的基本用法||webpack 中配置 vue 组件的加载器|| 在 webpack 项目中使用 vue

    Vue 单文件组件 传统组件的问题和解决方案 1. 问题 1. 全局定义的组件必须保证组件的名称不重复 2. 字符串模板缺乏语法高亮,在 HTML 有多行的时候,需要用到丑陋的 \ 3. 不支持 CS ...

最新文章

  1. OpenCV编程案例:使用轮廓函数检测连通区域
  2. cf round #421 div2 D. Mister B and PR Shifts
  3. 测试分析设计工程方法
  4. hashCode()方法(覆盖hashCode()方法)
  5. JSESSIONID的简单说明
  6. dd linux 尾部添加0_Linux文件目录命令整理Linux学习
  7. idea2020配置springboot热部署超全步骤以及安装JRebel插件
  8. 信息学奥赛C++语言:数字卡片
  9. 拳王虚拟项目公社:一款解除网站禁止复制的插件,Simple Allow Copy V 0.8.2
  10. 用java语言编写的操作系统属于_为什么操作系统不是用java编写的?
  11. Windows Server 2016 搭建 FTP服务
  12. 实现一个react系列一:JSX和虚拟DOM
  13. C++关闭同步流 ios::sync_with_stdio(false);
  14. JDK 8.0 新特性——接口默认方法与静态方法
  15. 概率论在实际生活的例子_概率论在实际生活中的应用
  16. 脾气与冲突--试用ymlf下wine跑windows程序有感
  17. 春节高并发抢红包的技术升华综合实战(Node.js)
  18. WebApi 下载文件流?
  19. Hexo 个性化配置(三)
  20. 预装Win10的电脑改Win7的方法

热门文章

  1. hive创建表---并把数据导入表中
  2. MindSDK+yolov5部署及python版图像视频推理实现
  3. 【solr专题之四】在Tomcat 中部署Solr4.x
  4. 【Lucene4.8教程之五】Luke
  5. 模型评估准确率、召回率、ROC曲线、AUC总结
  6. Elasticsearch技术解析与实战(三)文档的聚合
  7. 人工智能免费学习!想了解的进来看看
  8. HTML(六)------ CSS
  9. 《JavaScript面向对象编程指南》——1.7 训练环境设置
  10. 技术干货 | Docker容器中需要避免的十种常见误区