vue格式控制

prettier-vscode, Visual Studio 代码扩展,实现漂亮

Visual Studio Code plugin for Prettier

源代码名称:prettier-vscode

更漂亮的Visual Studio 代码格式化程序

vs 代码包,使用 来格式化你的JavaScript/TypeScript/CSS。

安装

通过 vs 代码扩展安装。 搜索 Prettier - Code formatter

Visual Studio 代码市场位置: 高级代码格式化程序

也可以使用

复制代码

ext install prettier-vscode

用法

使用命令选项板( /ctrl + Shift + P )

复制代码

1. CMD + Shift + P -> Format Document
OR
1. Select the text you want to Prettify
2. CMD + Shift + P -> Format Selection

自定义键绑定

如果不喜欢默认值,可以在vscode的键盘快捷键菜单中重新绑定 editor.action.formatDocument和 editor.action.formatSelection

保存时的文件格式

尊重 editor.formatOnSave 设置。

你可以通过设置设置范围,在每个语言基础上启用 format-on-save:

复制代码

//Set the default"editor.formatOnSave": false,
//Enable per-language"[javascript]": {
 "editor.formatOnSave": true}

设置

漂亮的设置

将从( 按优先级列出) 读取设置:

或者如果不存在漂亮的配置文件

  • .editorconfig
  • 漂亮的VSCode设置( 描述了 below 及其默认值)
  • prettier.printWidth ( 默认:80 )

在这里行范围内配合代码

prettier.tabWidth ( 默认:2 )

每个选项卡应使用的空格数

prettier.singleQuote ( 默认:false )

如果 true,将使用单引号代替双引号

prettier.trailingComma ( 默认值:'( 无)

控制尽可能地打印尾随逗号。 有效选项:

  • "none - 没有尾随逗号
  • ""在 ES5 ( 对象。数组等) 中有效的逗号
  • "所有可能的逗号( 函数参数)

prettier.bracketSpacing ( 默认:true )

控制空格 inside 对象文字的打印

prettier.jsxBracketSameLine ( 默认:false )

如果 true,则将 多行 jsx元素的> 放在最后一行的末尾,而不是单独的一行

prettier.parser ( 默认值:'巴比伦') - JavaScript

使用哪个分析程序有效的选项是'流'和'巴比伦'。

prettier.semi ( 默认:true )

是否在每行的末尾添加分号( 半: true ),或者仅在可能引入ASI故障的行的开头( 半: false )

prettier.useTabs ( 默认:false )

如果为 true,则用制表符缩进行

prettier.proseWrap ( 默认值:'保留"

( Markdown ) 将散文包装在多行上。

prettier.arrowParens ( 默认值:'避免)"

在单个箭头函数参数周围包含圆括号

VSCode特定设置

这些设置特定于 VSCode,需要在VSCode设置文件中设置。 有关如何执行该操作的信息,请参阅文档。

prettier.eslintIntegration ( 默认值:false ) - 仅适用于JavaScript和 TypeScript

使用 prettier更漂亮的eslint 代替漂亮的。 其他设置仅在无法从ESLint规则推断出时进行回退。

prettier.stylelintIntegration ( 默认值:false ) - CSS,SCSS和 LESS

使用 prettier更漂亮的stylelint 代替漂亮的。 其他设置仅在无法从stylelint规则推断出时进行回退。

prettier.requireConfig ( 默认:false )

需要一个'prettierconfig'来格式化

( 缺省:。prettierignore )

提供忽略文件的路径,如 .gitignore 或者 .prettierignore。 匹配的文件将不被格式化。 设置为 null 不读取忽略文件。 需要重新启动。

prettier.disableLanguages ( 默认:["vue"] )

要禁用这里扩展的语言id列表。 Restart需要Restart注意:禁用父文件夹中启用的语言将禁止格式化,而不允许任何其他格式化程序运行该语言。

更漂亮的分辨率

这里扩展将在你的项目依赖项的本地。 应该不会使用你的项目依赖项本地安装,副本将与扩展绑定在一起。

 

欢迎开放问题或者 PRs !

运行扩展

  • 打开这里存储库 inside VSCode
  • 调试侧边栏
  • Launch Extension

运行测试

测试打开一个VSCode实例并将 ./testProject 加载为 root 工作区。

  • 打开这里存储库 inside VSCode
  • 调试侧边栏
  • Launch Tests

或者

没有实例VSCode运行( 否则就不会开始) npm run test

转自:https://www.helplib.com/GitHub/article_149490

猜你喜欢

转载自blog.csdn.net/weixin_39885843/article/details/88019922