快捷键

Expand Selection / Shrink Selection
Shift+Alt+Right
Shift+Alt+Left
https://code.visualstudio.com/updates/v1_33#_smart-select-api

折叠/展开区域
ctrl shift [
ctrl shift ]

调试

https://code.visualstudio.com/Docs/editor/debugging

VSCode launch.json中的各种替换变量的意思 ${workspaceFolder} ${file} ${fileBasename} ${fileDirname}等
https://blog.csdn.net/bat67/article/details/78302871
https://code.visualstudio.com/docs/editor/variables-reference

插件

  • Beautify ( 代码格式化 )

https://marketplace.visualstudio.com/items?itemName=HookyQR.beautify

https://gist.github.com/wzup/fc3254562236c1ec3f69
https://github.com/HookyQR/VSCodeBeautify/blob/master/Settings.md

  1. {
  2.   "html": {
  3.     "allowed_file_extensions": ["htm", "html", "xhtml", "shtml", "xml", "svg", "dust"],
  4.     "brace_style": "collapse,preserve-inline",
  5.     "end_with_newline": true,
  6.     "indent_char": " ",
  7.     "indent_handlebars": true,
  8.     "indent_inner_html": false,
  9.     "indent_scripts": "keep",
  10.     "indent_size": 2,
  11.     "max_preserve_newlines": 10,
  12.     "preserve_newlines": true,
  13.     "unformatted": ["a", "span", "img", "code", "pre", "sub", "sup", "em", "strong", "b", "i", "u", "strike", "big", "small", "pre", "h1",
  14.       "h2", "h3", "h4", "h5", "h6"
  15.     ],
  16.     "wrap_attributes":"align-multiple",
  17.     "wrap_line_length": 0
  18.   },
  19.   "css": {
  20.     "allowed_file_extensions": ["css", "scss", "sass", "less"],
  21.     "end_with_newline": true,
  22.     "indent_char": " ",
  23.     "indent_size": 2,
  24.     "newline_between_rules": true,
  25.     "selector_separator": " ",
  26.     "selector_separator_newline": true,
  27.     "preserve_newlines": true,
  28.     "max_preserve_newlines": 10
  29.   },
  30.   "js": {
  31.     "allowed_file_extensions": ["js", "json", "jshintrc", "jsbeautifyrc"],
  32.     "brace_style": "collapse,preserve-inline",
  33.     "break_chained_methods": false,
  34.     "e4x": false,
  35.     "end_with_newline": false,
  36.     "indent_char": " ",
  37.     "indent_level": 0,
  38.     "indent_size": 2,
  39.     "indent_with_tabs": false,
  40.     "jslint_happy": false,
  41.     "keep_array_indentation": false,
  42.     "keep_function_indentation": false,
  43.     "max_preserve_newlines": 0,
  44.     "preserve_newlines": true,
  45.     "space_after_anon_function": true,
  46.     "space_before_conditional": true,
  47.     "space_in_empty_paren": false,
  48.     "space_in_paren": false,
  49.     "unescape_strings": false,
  50.     "wrap_line_length": 0
  51.   }
  52. }
  • GitLens ( 版本管理 )

https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens

  • VS Code JavaScript (ES6) snippets

https://marketplace.visualstudio.com/items?itemName=xabikos.JavaScriptSnippets
Supported languages (file extensions)
• JavaScript (.js)
• TypeScript (.ts)
• JavaScript React (.jsx)
• TypeScript React (.tsx)
• Html (.html)
• Vue (.vue)

imp clg ….

  • live server

.vscode/setting.json

  1. {
  2.   "liveServer.settings.root": "/dist/"
  3. }

路径搜索

https://code.visualstudio.com/docs/languages/jsconfig

根文件夹 jsconfig.json

  1. {
  2.   "include": ["./src"],
  3.   "compilerOptions": {
  4.     "target": "es2016",
  5.     "sourceMap": true,
  6.     "baseUrl": ".",
  7.     "jsx": "react",
  8.     "moduleResolution": "node",
  9.     "paths": {
  10.       "*": ["src/*"]
  11.     }
  12.   },
  13.   "exclude": ["node_modules", "build"]
  14. }
  1. {
  2.   "compilerOptions": {
  3.     "target": "es6",
  4.     "baseUrl": ".",
  5.     "paths": {
  6.       "@/*": ["src/*"],
  7.       "components/*":["src/components/*"],
  8.       "common/*":["src/common/*"],
  9.       "modules/*":["src/modules/*"],
  10.       "assets/*":["src/assets/*"]
  11.     }
  12.   },
  13.   "exclude": ["node_modules", "dist"],
  14.   // "include": ["src/**/*"]
  15. }

paths里面的路径对应webpack alias的路径, 写法和webpack alias稍微不一样

vue配置

https://github.com/vuejs/vetur/blob/master/docs/setup.md
https://github.com/vuejs/vetur/blob/master/docs/FAQ.md#vetur-cant-recognize-components-imported-using-webpacks-alias

编写插件

https://code.visualstudio.com/api

C / C++

一篇挺详细的教程, 照着配完就能用
https://www.zhihu.com/question/30315894/answer/154979413
关于调试配置等, 都有

以下两个都要装:

MinGW是将GCC编译器和GNU Binutils移植到Win32平台下的产物，包括一系列头文件（Win32API）、库和可执行文件。简而言之，MinGW是Windows下的GCC。
Clang是一个C、C++、Objective-C和Objective-C++编程语言的编译器前端。它采用了底层虚拟机（LLVM）作为其后端。它的目标是提供一个GNU编译器套装（GCC）的替代品。Clang性能优异，还能针对用户发生的编译错误准确地给出建议。

安装 MinGW-w64
解压后将 MinGW 文件夹复制到 C: 盘根目录。
添加 PATH 搜索路径 C:\MinGW\bin。
启动命令窗口，执行 gcc —version，看到 gcc 版本信息，则安装成功。
注 MinGW没更新了, 不要用MinGW, 要用MinGW-w64

MinGW-w64下载
http://mingw-w64.org/doku.php/download/win-builds (安装器, 还需要再下一堆东西, 很慢)
https://sourceforge.net/projects/mingw-w64/files/mingw-w64/mingw-w64-release/ (直接下载解压)

安装 Clang
执行 LLVM 安装程序，并选择将 LLVM 添加到 PATH。
启动命令窗口，执行 clang -v，看到 clang 版本号，则安装成功。
https://github.com/zhuangbo/MinGW-and-Clang

Annex