vscode根据prettier设置的格式 保存自动格式化_vue保存自动格式化

主要步骤：

1.vscode安装插件Prettier - Code formatter

2.设置默认格式为prettier

3.配置vscode保存自动格式化

4.安装prettier依赖，配置格式

第一步vscode插件市场安装Prettier - Code formatter 并启用

第二步设置默认格式 文件-首选项-设置-搜索default format-选择Prettier - Code formatter

也可以再settings.json中配置"editor.defaultFormatter": "esbenp.prettier-vscode"。

第三步 设置保存自动格式化，文件-首选项-设置-搜索format on save-勾选保存格式化

也可以再settings.json中配置"editor.formatOnSave": true

第四步安装prettier依赖，根目录下新建.prettierrc.cjs文件，文件中配置格式，根目录下新建.prettierignore文件配置忽略格式化的文件

npm i prettier -D

安装完成是这个版本

module.exports = {
  // 一行最多 100 字符
  printWidth: 100,
  // 使用 2 个空格缩进
  tabWidth: 2,
  // 不使用缩进符，而使用空格
  useTabs: false,
  // 不尾随分号
  semi: false,
  // 使用单引号
  singleQuote: true,
  // 多行逗号分割的语法中，最后一行不加逗号
  trailingComma: 'none',
  // 单个参数的箭头函数不加括号 x => x
  arrowParens: 'avoid',
  // 对象大括号内两边是否加空格 { a:0 }
  bracketSpacing: true,
  // 保证以LF结尾
  endOfLine: 'auto'
}

完成上述配置后，重启项目，就可以保存代码时会根据.prettierrc.cjs文件中的配置自动格式化。每次修改这个文件时 需要重启vscode 否则有时候格式会有缓存。