VScode prettier的配置

这篇具有很好参考价值的文章主要介绍了VScode prettier的配置。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

设置保存是格式化
vscode prettier配置,vscode,prettier

prettier的配置文件:.prettierrc.js

module.exports = {
	// 一行最多多少个字符
	printWidth: 150,
	// 指定每个缩进级别的空格数
	tabWidth: 2,
	// 使用制表符而不是空格缩进行
	useTabs: true,
	// 在语句末尾打印分号
	semi: true,
	// 使用单引号而不是双引号
	singleQuote: true,
	// 更改引用对象属性的时间 可选值"<as-needed|consistent|preserve>"
	quoteProps: 'as-needed',
	// 在JSX中使用单引号而不是双引号
	jsxSingleQuote: false,
	// 多行时尽可能打印尾随逗号。(例如,单行数组永远不会出现逗号结尾。) 可选值"<none|es5|all>",默认none
	trailingComma: 'es5',
	// 在对象文字中的括号之间打印空格
	bracketSpacing: true,
	// jsx 标签的反尖括号需要换行
	jsxBracketSameLine: false,
	// 在单独的箭头函数参数周围包括括号 always:(x) => x \ avoid:x => x
	arrowParens: 'always',
	// 这两个选项可用于格式化以给定字符偏移量(分别包括和不包括)开始和结束的代码
	rangeStart: 0,
	rangeEnd: Infinity,
	// 指定要使用的解析器,不需要写文件开头的 @prettier
	requirePragma: false,
	// 不需要自动在文件开头插入 @prettier
	insertPragma: false,
	// 使用默认的折行标准 always\never\preserve
	proseWrap: 'preserve',
	// 指定HTML文件的全局空格敏感度 css\strict\ignore
	htmlWhitespaceSensitivity: 'css',
	// Vue文件脚本和样式标签缩进
	vueIndentScriptAndStyle: false,
	// 换行符使用 lf 结尾是 可选值"<auto|lf|crlf|cr>"
	endOfLine: 'lf',

};

3.设置prettier作为配置格式化
vscode prettier配置,vscode,prettier文章来源地址https://www.toymoban.com/news/detail-523081.html

到了这里,关于VScode prettier的配置的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • vscode自动格式化插件配置说明(Prettier - Code formatter)

    1、在应用商店搜索Prettier并下载 2、下载完成之后点击扩展设置  3、点击右上角json配置文件  4、在文件中添加如下代码 5、如果需要格式化vue文件,建议配合ESLint、Vetur两个插件一起使用  一款好用的eslint自动修复插件:eslint-config

    2024年02月12日
    浏览(56)
  • vscode vue3开发常用插件(附Prettier格式化配置)

    1、Chinese (Simplified) (简体中文) Language 2、Prettier - Code formatter 3、Vue 3 Snippets 4、Vue Language Features (Volar) 5、git graph 5、Auto Close Tag 6、Vue Theme 按ctrl+shift+p,搜索setting进入用户设置(全局),添加下面规则: 需要注意的是,prtttier格式化可以配置在很多文件上,配置字段也不太一样

    2024年02月14日
    浏览(57)
  • VsCode中Vue代码格式插件,Vetur、ESLint 、Prettier - Code formatter的介绍使用及相关配置

    Vetur是一款Vue代码高亮显示的一款插件,在没有使用此插件前,以 .vue的文件名代码是没有颜色的!!! 安装步骤:在扩展商店中搜索(  Vetur  )点击安装  ESLint插件主要用来检测代码的语法格式,以便我们规范书写,避免因编译所发生的错误 。 安装步骤:在扩展商店中搜

    2024年02月16日
    浏览(36)
  • 【VScode】ESLint :warning Delete `CR` prettier/prettier

    作用     检查 Javascript 编程时的语法错误。 新建或修改文件时报错 原因      Windows系统 ,clone的代码会自动把换行符 LF 转为回车符 CRLF ,这时本地的代码都是回车符。可在prettier.config.js中查看到 检查配置(ESLint中是否支持JavaScript/vue语言) (1)在VScode中,使用Ctr + 打开

    2024年02月02日
    浏览(56)
  • Delete `␍`eslint(prettier/prettier) in vscode 的解决方案

    从 Github 仓库拉取代码,使用 vscode 打开,页面报错,每一行都爆红 (如下图) 由于历史原因,windows下和linux下的文本文件的换行符不一致。 Windows在换行的时候,使用了换行符 CRLF 而Mac和Linux系统,仅仅使用了换行符 LF 老版本的Mac系统使用的是回车符 CR 本人的电脑是 windo

    2024年02月07日
    浏览(52)
  • vscode设置Prettier为默认格式化插件

    1. 目的:ctrl+s保存,自动格式化文档 2. 所需插件Prettier 3. 操作步骤 先打开vscode软件,左下角点击设置 — 打开设置 ---- 在右上方有一个搜索框。 先设定自动保存文件,搜索框贴入 files.autoSave 筛出设置项,并把设置项属性选择为 onFocuschange 。 设定编辑器默认代码格式化(美化

    2024年02月06日
    浏览(56)
  • VSCode中Prettier插件&依赖安装及冲突解决

    1.1 安装Prettier插件 通过 VSCode 安装插件,如图: 1.2 添加Prettier配置文件 在项目根目录,添加 Prettier 配置文件 .prettierrc ,编写配置如下: 1.3 配置格式化工具 在任意页面右键,选择 格式化工具 ,如图: 将 Prettier 配置为格式化默认工具即可 1.4 配置自动格式化 选择 设置 ,如

    2023年04月08日
    浏览(37)
  • vscode使用eslint及prettier配合解决代码格式问题

    esLint是提供一个插件化的javascript代码检测工具。 esLint 配置文件遵循 commonJS 的导出规则,所导出的对象是 eslint 的配置对象。 1、打开vscode 在插件选项中找到对应插件进行安装即可。 2、新建一个.prettierrc文件 在该文件下,写入一下代码 3、设置vscode保存代码时,让代码符合

    2024年02月02日
    浏览(46)
  • 【vscode 格式化】prettier 格式化之后添加逗号,与eslint冲突

    最近格式化文件的时候老是添加逗号,保存的时候会eslint在格式化一遍,将逗号删掉;就感觉不是很舒服; 有两种方法, 一、配置 .prettierrc 文件; 文件配置,可直接用,配合eslint使用足够了 JSON文件是不支持备注的,cv过去时要删掉注释 2.就是在设置的搜索框中输入“vet

    2024年02月12日
    浏览(80)
  • vscode编辑器,vue、小程序等语言适配eslint格式校验 + prettier 保存时自动修改格式

    目的:自留备份,用者自取 基础配置 1 基于vscode编辑器,prettier插件需要下载 2 eslint配置项规则: https://eslint.bootcss.com/docs/rules/ 3 prettier配置项规则: https://prettier.io/docs/en/options.html 安装插件 配置文件问题: 如果项目中带有.vscode文件夹,这里面的setting.json会覆盖全局的sett

    2024年02月09日
    浏览(55)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包