[Vscode code formatting] Prettier - Code formatter plug-in implementation

1, the mounting extensions prettier - Code Formatter
Here Insert Picture Description
2, vue achieve desired formatting can add additional plug vetur
Here Insert Picture Description
3, the following code is added in the configuration file, the user can save the code that is implemented formatted

Specific rules may make changes based on code style,
official configuration file address: https://prettier.io/docs/en/configuration.html

  // tab 大小为2个空格
  "editor.tabSize": 2,
  // 100 列后换行
  "editor.wordWrapColumn": 100,
  // 保存时格式化
  "editor.formatOnSave": true,
  // 开启 vscode 文件路径导航
  "breadcrumbs.enabled": true,
  // prettier 设置语句末尾不加分号
  "prettier.semi": false,
  // prettier 设置强制单引号
  "prettier.singleQuote": true,
  
  // 选择 vue 文件中 template 的格式化工具
  "vetur.format.defaultFormatter.html": "prettyhtml",
  
  // 显示 markdown 中英文切换时产生的特殊字符
  "editor.renderControlCharacters": true,
  
  // vetur 的自定义设置
  "vetur.format.defaultFormatterOptions": {
    "prettier": {
      "singleQuote": true,//用单引号
      "semi": false	//不加分号
    }
  }
Published 43 original articles · won praise 1 · views 3119

Guess you like

Origin blog.csdn.net/u011523953/article/details/104768368