[vscode] prettier插件的设置

[david2tdw]

VScode格式化ESlint-方法

[david2tdw]

1. vscode需要安装的插件
   vetur
   prettier
   Manta's Stylus Supremacy

2. settings.json的文件配置如下：

{
    "editor.fontSize": 16,
    "editor.tabSize": 2,
    "editor.minimap.enabled": false,
    "editor.wordWrap": "on",
    "files.exclude": {
        "**/dist": true,
        "**/site": true
    },
    "search.exclude": {
        "**/dist": true
    },
    "workbench.colorTheme": "Visual Studio Dark",
    "bracketPairColorizer.showHorizontalScopeLine": false,
    "bracketPairColorizer.showVerticalScopeLine": false,
    "[vue]": {
        "editor.defaultFormatter": "octref.vetur"
    },
    "prettier.singleQuote": true,
    "prettier.printWidth": 120,
    "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
    "typescript.format.semicolons": "remove",
    "vetur.format.defaultFormatter.js": "vscode-typescript",
    "stylusSupremacy.insertSemicolons": false,
    "stylusSupremacy.insertBraces": false, // 是否插入大括号
    "stylusSupremacy.insertNewLineAroundBlocks": false
}

3. 设置默认的格式化工具为vetur， 不要设置为prettier。

[david2tdw]

prettier在格式化的时候 函数名后不会留有空格。需要使用vetur调用vscode自带的ts格式化插件解决这个问题。

具体配置为：

"vetur.format.defaultFormatter.js": "vscode-typescript",
"javascript.format.insertSpaceBeforeFunctionParenthesis": true

[david2tdw]

"typescript.format.semicolons": "remove",

去掉"vscode-typescript"格式化js后生成的分号。

[david2tdw]

"prettier.semi": false, // 去掉行末尾的分号

1. 去掉分号先用prettier格式化。
2. 再用vetur使用"vscode-typescript" 去添加函数名后的空格。

bug：
prettier: 函数名后无法添加空格。
vetur -> format html ->prettier: 每行的宽度设定无法生效。
vetur -> format html ->prettyhtml: 单双引号转换错误 issue 116
vetur使用"vscode-typescript"添加函数名称后面的空格时： 无法去除每行最后的空格

[david2tdw]

settings.json

{
  "editor.fontSize": 16,
  "editor.tabSize": 2,
  "editor.minimap.enabled": false,
  "editor.wordWrap": "on",
  "files.exclude": {
    "**/.classpath": true,
    "**/.factorypath": true,
    "**/.project": true,
    "**/.settings": true,
    "**/*.meta": true,
    "**/bower_components": true,
    "**/dist": false,
    "**/site": true,
    "library/": true,
    "local/": true,
    "temp/": true
  },
  "search.exclude": {
    "**/*.anim": true,
    "**/dist": true,
    "**/node_modules": true,
    "build/": true,
    "library/": true,
    "temp/": true
  },
  "workbench.colorTheme": "Visual Studio Dark",
  "bracketPairColorizer.showHorizontalScopeLine": false,
  "bracketPairColorizer.showVerticalScopeLine": false,
  "[vue]": {
    "editor.defaultFormatter": "octref.vetur"
  },
  "prettier.singleQuote": true,
  "prettier.printWidth": 120,
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
  "vetur.format.defaultFormatter.js": "vscode-typescript",
  "typescript.format.semicolons": "remove",
  "stylusSupremacy.insertSemicolons": false,
  "stylusSupremacy.insertBraces": false, // 是否插入大括号
  "stylusSupremacy.insertNewLineAroundBlocks": false,
  "prettier.semi": false,
  "[html]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[json]": {
    "editor.defaultFormatter": "vscode.json-language-features"
  },
  "window.zoomLevel": 0,
  "emmet.triggerExpansionOnTab": true,
  "dart.openDevTools": "flutter",
  "dart.debugExternalLibraries": true,
  "dart.debugSdkLibraries": true,
  "workbench.editor.enablePreview": false,
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "javascript.updateImportsOnFileMove.enabled": "always",
  "editor.suggestSelection": "first",
  "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
  "java.requirements.JDK11Warning": false,
  "java.home": "C:\\Java\\jdk1.8.0_121",
  "liveServer.settings.donotVerifyTags": true,
  "files.associations": {
  
  },
  "[typescript]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "vscode.typescript-language-features"
  },
  "liveServer.settings.host": "localhost",
  "liveServer.settings.multiRootWorkspaceName": "",
  "vetur.format.defaultFormatter.html": "prettier",
  "bracketPairColorizer.activeScopeCSS": [
  
    "borderStyle : solid",
    "borderWidth : 1px",
    "borderColor : {color}; opacity: 0.5"
  ]
}

[xuiang]

cool