Blog 记录：VSCode个人配置

记录：VSCode个人配置

Open idseventeen opened this issue 4 years ago • 0 comments

之前的配置弄丢了，在这里备份一下吧主要用于前端开发（Vue、小程序）使用eslint-standard规范

吐槽：

vscode有单引号规则配置，但format时却没有效果

prettier不支持定义函数参数括号前的空格的处理方式

VSCode配置Settings.json

{
  "editor.tabSize": 2,
  "editor.renderWhitespace": "boundary",
  "editor.formatOnType": true,
  "editor.formatOnPaste": true,
  "editor.renderControlCharacters": true,
  "editor.quickSuggestions": {
    "strings": true
  },
  "workbench.iconTheme": "vscode-icons",
  "workbench.colorTheme": "One Dark Pro Vivid",
  "workbench.editor.showTabs": true,
  "git.autofetch": true,
  "git.confirmSync": false,
  "files.trimTrailingWhitespace": true,
  "files.associations": {
    "*.wpy": "vue",
    "*.wxss": "css",
    "*.wxml": "wxml",
    "*.vm": "html",
    "*.wxc": "vue",
    "*.wepg": "html",
    "*.js": "javascript",
    "*.cjson": "jsonc",
    "*.wxs": "javascript"
  },
  "emmet.includeLanguages": {
    "wxml": "html",
    "vue-html": "html"
  },
  "window.zoomLevel": 0,
  "terminal.integrated.cursorBlinking": true,
  "better-comments.highlightPlainText": true,
  "gitlens.hovers.currentLine.over": "line",
  "minapp-vscode.disableAutoConfig": true,
  "npm-intellisense.importLinebreak": "",
  "javascript.preferences.quoteStyle": "single",
  "javascript.format.insertSpaceAfterConstructor": true,
  "javascript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets": true,
  "javascript.format.insertSpaceBeforeFunctionParenthesis": true,
  "javascript.format.semicolons": "remove",
  "javascript.implicitProjectConfig.checkJs": true,
  "typescript.preferences.quoteStyle": "single",
  "typescript.format.insertSpaceAfterConstructor": true,
  "typescript.format.insertSpaceAfterOpeningAndBeforeClosingNonemptyBrackets": true,
  "typescript.format.insertSpaceBeforeFunctionParenthesis": true,
  "typescript.format.semicolons": "remove",
  "eslint.enable": true,
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    {
      "language": "vue",
      // "autoFix": true
    }
  ],
  "prettier.printWidth": 99999,
  "prettier.semi": false,
  "prettier.singleQuote": true,
  // [email protected]版本无效，暂且保留吧
  "prettier.spaceBeforeFunctionParen": true,
  // eslint配置格式化文档(仅在[email protected]版本有效)
  "prettier.eslintIntegration": true,
  // tslint配置格式化文档(仅在[email protected]版本有效)
  "prettier.tslintIntegration": true,
  "extensions.showRecommendationsOnlyOnDemand": true,
  // TIP: prettier-vscode和vscode-typescript都不能完整的支持standardjs标准
  //      vue文件格式化使用vscode-typescript，尽量使用vscode内置格式化标准来吧...
  "vetur.format.defaultFormatter.js": "vscode-typescript",
  "vetur.format.defaultFormatter.ts": "vscode-typescript",
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[html]": {
    "editor.defaultFormatter": "vscode.html-language-features"
  },
  "[json]": {
    "editor.defaultFormatter": "vscode.json-language-features"
  },
  "[jsonc]": {
    "editor.defaultFormatter": "vscode.json-language-features"
  },
  "[yaml]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[markdown]": {
    "editor.defaultFormatter": "yzhang.markdown-all-in-one"
  },
  "[vue]": {
    "editor.defaultFormatter": "octref.vetur"
  },
  "extensions.autoUpdate": false,
}

插件列表

名称: Auto Close Tag id: formulahendry.auto-close-tag 说明: Automatically add HTML/XML close tag, same as Visual Studio IDE or Sublime Text 版本: 0.5.6 发布者: Jun Han VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-close-tag

名称: Auto Rename Tag id: formulahendry.auto-rename-tag 说明: Auto rename paired HTML/XML tag 版本: 0.1.1 发布者: Jun Han VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=formulahendry.auto-rename-tag

名称: Better Comments id: aaron-bond.better-comments 说明: Improve your code commenting by annotating with alert, informational, TODOs, and more! 版本: 2.0.5 发布者: Aaron Bond VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments

名称: carbon-now-sh id: ericadamski.carbon-now-sh 说明: A Code package to open the current editor content in carbon.now.sh 版本: 1.2.0 发布者: Eric Adamski VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=ericadamski.carbon-now-sh

名称: Docker id: ms-azuretools.vscode-docker 说明: Adds syntax highlighting, commands, hover tips, and linting for Dockerfile and docker-compose files. 版本: 0.8.2 发布者: Microsoft VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-docker

名称: Document This id: joelday.docthis 说明: Automatically generates detailed JSDoc comments in TypeScript and JavaScript files. 版本: 0.7.1 发布者: Joel Day VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=joelday.docthis

名称: EditorConfig for VS Code id: editorconfig.editorconfig 说明: EditorConfig Support for Visual Studio Code 版本: 0.14.2 发布者: EditorConfig VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=EditorConfig.EditorConfig

名称: eggjs id: atian25.eggjs 说明: vscode extension for https://eggjs.org/ 版本: 0.3.1 发布者: atian25 VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=atian25.eggjs

名称: ESLint id: dbaeumer.vscode-eslint 说明: Integrates ESLint JavaScript into VS Code. 版本: 1.9.1 发布者: Dirk Baeumer VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint

名称: GitLens — Git supercharged id: eamodio.gitlens 说明: Supercharge the Git capabilities built into Visual Studio Code — Visualize code authorship at a glance via Git blame annotations and code lens, seamlessly navigate and explore Git repositories, gain valuable insights via powerful comparison commands, and so much more 版本: 10.1.2 发布者: Eric Amodio VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens

名称: HTML CSS Support id: ecmel.vscode-html-css 说明: CSS support for HTML documents 版本: 0.2.3 发布者: ecmel VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=ecmel.vscode-html-css

名称: HTML Snippets id: abusaidm.html-snippets 说明: Full HTML tags including HTML5 Snippets 版本: 0.2.1 发布者: Mohamed Abusaid VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=abusaidm.html-snippets

名称: JavaScript (ES6) code snippets in StandardJS style id: jmsv.javascriptsnippetsstandard 说明: Code snippets for JavaScript in ES6 syntax in StandardJS style 版本: 1.7.2 发布者: James Vickery VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=jmsv.JavaScriptSnippetsStandard

名称: Live Server id: ritwickdey.liveserver 说明: Launch a development local Server with live reload feature for static & dynamic pages 版本: 5.6.1 发布者: Ritwick Dey VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer

名称: Markdown All in One id: yzhang.markdown-all-in-one 说明: All you need to write Markdown (keyboard shortcuts, table of contents, auto preview and more) 版本: 2.5.1 发布者: Yu Zhang VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=yzhang.markdown-all-in-one

名称: markdownlint id: davidanson.vscode-markdownlint 说明: Markdown linting and style checking for Visual Studio Code 版本: 0.32.0 发布者: David Anson VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=DavidAnson.vscode-markdownlint

名称: minapp id: qiu8310.minapp-vscode 说明: 微信小程序标签、属性的智能补全（同时支持原生小程序、mpvue 和 wepy 框架，并提供 snippets）版本: 2.2.2 发布者: Mora Qiu VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=qiu8310.minapp-vscode

名称: npm id: eg2.vscode-npm-script 说明: npm support for VS Code 版本: 0.3.9 发布者: egamma VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=eg2.vscode-npm-script

名称: npm Intellisense id: christian-kohler.npm-intellisense 说明: Visual Studio Code plugin that autocompletes npm modules in import statements 版本: 1.3.0 发布者: Christian Kohler VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=christian-kohler.npm-intellisense

名称: One Dark Pro id: zhuangtongfa.material-theme 说明: Atom's iconic One Dark theme for Visual Studio Code 版本: 2.28.3 发布者: binaryify VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=zhuangtongfa.Material-theme

名称: open in browser id: techer.open-in-browser 说明: This allows you to open the current file in your default browser or application. 版本: 2.0.0 发布者: TechER VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=techer.open-in-browser

名称: Path Intellisense id: christian-kohler.path-intellisense 说明: Visual Studio Code plugin that autocompletes filenames 版本: 1.4.2 发布者: Christian Kohler VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense

名称: Prettier - Code formatter id: esbenp.prettier-vscode 说明: Code formatter using prettier 版本: 2.3.0 发布者: Esben Petersen VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode

名称: Sass id: syler.sass-indented 说明: Indented Sass syntax Highlighting, Autocomplete & Formatter 版本: 1.6.9 发布者: Syler VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=Syler.sass-indented

名称: Sass Lint id: glen-84.sass-lint 说明: Sass Lint for Visual Studio Code 版本: 1.0.6 发布者: glen-84 VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=glen-84.sass-lint

名称: StandardJS - JavaScript Standard Style id: chenxsan.vscode-standardjs 说明: Integrates JavaScript Standard Style into VS Code. 版本: 1.2.3 发布者: Sam Chen VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=chenxsan.vscode-standardjs

名称: Swagger Viewer id: arjun.swagger-viewer 说明: Swagger Viewer lets you preview and validate Swagger 2.0 and OpenAPI files as you type in Visual Studio Code. 版本: 2.2.2 发布者: Arjun G VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=Arjun.swagger-viewer

名称: TSLint id: ms-vscode.vscode-typescript-tslint-plugin 说明: TSLint support for Visual Studio Code 版本: 1.2.3 发布者: Microsoft VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=ms-vscode.vscode-typescript-tslint-plugin

名称: Vetur id: octref.vetur 说明: Vue tooling for VS Code 版本: 0.22.6 发布者: Pine Wu VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=octref.vetur

名称: vscode weapp api id: coderfee.vscode-weapp-api 说明: Wechat app api snippets for vscode 版本: 0.1.8 发布者: coderfee VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=coderfee.vscode-weapp-api

名称: vscode wxml id: coderfee.vscode-wxml 说明: Wechat wxml support/snippets for vscode 版本: 0.1.9 发布者: coderfee VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=coderfee.vscode-wxml

名称: vscode-element-helper id: elemefe.vscode-element-helper 说明: A vscode extension for Element-UI 版本: 0.5.6 发布者: ElemeFE VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=ElemeFE.vscode-element-helper

名称: vscode-icons id: vscode-icons-team.vscode-icons 说明: Icons for Visual Studio Code 版本: 9.5.0 发布者: VSCode Icons Team VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=vscode-icons-team.vscode-icons

名称: YAML id: redhat.vscode-yaml 说明: YAML Language Support by Red Hat, with built-in Kubernetes and Kedge syntax support 版本: 0.5.3 发布者: Red Hat VS Marketplace 链接: https://marketplace.visualstudio.com/items?itemName=redhat.vscode-yaml

Nov 14 '19 11:11 idseventeen

Blog Blog copied to clipboard

记录：VSCode个人配置

VSCode配置Settings.json

插件列表

Blog
Blog copied to clipboard