做到了什么

1、短的html标签缩进一行
2、长的html标签每个属性一行
3、htmljscss格式化
4、保存自动格式化

个人喜欢html统一在一行,这样清晰些。
但某些tabletree有超级多的属性,又希望分段。
偶然调试出了这样的配置可以两者兼顾,美哉~

预览

请添加图片描述

配置了什么

主要是两个插件
1、volar (我目前用的是vue3,如果你是v2,就用vetur )
在这里插入图片描述
2、prettier
在这里插入图片描述
其他的个人强烈推荐的:Path Intellisense,Git History,Auto Close Tag,Auto Rename Tag

Setting

{
  "tabnine.experimentalAutoImports": true,
  "volar.format.initialIndent": {
    "html": true
  },
  "prettier.semi": false,
  "prettier.enable": true,
  "eslint.packageManager": "yarn",
  "explorer.confirmDelete": false,
  "git.confirmSync": false,
  "git.enableSmartCommit": true,
  "security.workspace.trust.untrustedFiles": "open",
  "[vue]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "code-runner.languageIdToFileExtensionMap": {
    "bat": ".bat",
    "powershell": ".ps1",
    "typescript": ".ts"
  },
  "workbench.iconTheme": "material-icon-theme",
  "typescript.updateImportsOnFileMove.enabled": "always",
  "thiefBook.filePath": "E:/www/name.txt",
  "editor.suggest.showStatusBar": true,
  "thiefBook.currPageNumber": 32,
  "vscode-edge-devtools.webhint": false,
  "emmet.optimizeStylesheetParsing": false,
  "vue.autoInsert.dotValue": true,
  "vue.inlayHints.missingProps": true,
  "vue.inlayHints.inlineHandlerLeading": true,
  "vue.inlayHints.optionsWrapper": true,
  "vue.splitEditors.layout.left": ["script", "scriptSetup", "styles"],
  "prettier.printWidth": 150,
  "editor.formatOnSave": true,
  "emmet.syntaxProfiles": {
    "vue-html": "html",
    "vue": "html"
  }
}


发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注