介紹Visual studio code的用法,結合實際開發(fā)需要,突出介紹一些強悍技能。無論是MacBook 還是Windows用戶,它都能夠實現(xiàn)快速文本編輯和markdown編寫,讓文本編輯進入高效模式。
1. 公共篇
1.1 云備份配置,一個json文件搞定
{
? ? "workbench.colorTheme": "Quiet Light",
? ? "workbench.startupEditor": "newUntitledFile",
? ? "workbench.iconTheme": "vscode-icons",
? ? "workbench.editor.enablePreview": false, //不使用預覽打開
? ? // 避免每次窗口都被覆蓋
? ? "window.openFoldersInNewWindow": "on",
? ? "window.restoreWindows": "none",
? ? "files.autoSave": "afterDelay",
? ? "files.autoSaveDelay": 60000,
? ? // "security.workspace.trust.untrustedFiles": "open",
? ? "security.workspace.trust.enabled": false,
? //前端相關
? ? "[vue]": { //vuejs 格式化問題
? ? ? ? "editor.defaultFormatter": "octref.vetur"
? ? },
? ? "vetur.format.defaultFormatter.html": "js-beautify-html",
? ? "vetur.format.defaultFormatter.js": "prettier",
? ? "vetur.format.defaultFormatterOptions": {
? ? ? ? "js-beautify-html": {
? ? ? ? ? ? "wrap-attributes": "aligned-multiple",
? ? ? ? ? ? "wrap-attributes-indent-size": 4,
? ? ? ? ? ? "wrap-line-length": 150,
? ? ? ? ? ? "indent_size": 2, //兩個空格位置
? ? ? ? },
? ? ? ? "prettier": {
? ? ? ? ? ? "tabWidth": 2, //兩個空格位置
? ? ? ? ? ? "printWidth": 200,
? ? ? ? ? ? "singleQuote": false,
? ? ? ? ? ? "jsxBracketSameLine": true,
? ? ? ? },
? ? },
? ? "[javascript]": {? ? //JavaScript 格式化問題
? ? ? ? "editor.defaultFormatter": "HookyQR.beautify"
? ? },
? ? "[json]": {
? ? ? ? "editor.defaultFormatter": "HookyQR.beautify"
? ? },
? ? "editor.tabSize": 4,
? ? "editor.fontSize": 13,
? ? "editor.wordWrap":"wordWrapColumn",
? ? "editor.wordWrapColumn": 160,
? ? "editor.suggestSelection": "first",
? ? "editor.quickSuggestions": {
? ? ? ? "strings": true
? ? },
? ? //java 相關
? ? "java.home": "D:\\Program Files\\java\\jdk1.8.0_191",
? ? "java.semanticHighlighting.enabled": true,
? ? "java.configuration.maven.userSettings": "D:\\ProgramData\\apache-maven-3.5.4\\conf\\settings-admin.xml",
? ? "maven.executable.path": "D:\\ProgramData\\apache-maven-3.5.4\\bin\\mvn.cmd",
? ? "maven.excludedFolders": [
? ? ? ? "**/.*",
? ? ? ? "**/node_modules",
? ? ? ? "**/target",
? ? ? ? "**/bin"
? ? ],
? ? "files.exclude": {
? ? ? ? "**/.classpath": true,
? ? ? ? "**/.project": true,
? ? ? ? "**/.settings": true,
? ? ? ? "**/.factorypath": true
? ? },
? ? /*? 未知配置**/
? ? "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
? ? "prettier.tabWidth": 4,
? ? "prettier.eslintIntegration": true,
? ? "eslint.migration.2_x": "off",
? "eslint.autoFixOnSave": true,
? ? "eslint.validate": [
? ? ? ? "javascript",
? ? ? ? "javascriptreact",
? ? ? ? "html",
? ? ? ? {"language": "vue", "autoFix": true}
? ? ],
? ? "eslint.options": {
? ? ? ? //"configFile": "E:/git/github/styleguide/eslint/.eslintrc.js",
? ? ? ? "plugins": ["html"]
? ? },
}
1.2 列編輯
Windows: alt+shift
mac: option + shift

1.3 類似notepad++,遞增插入
1.3.1 安裝插件 Insert Numbers
Windows: control + alt + n
mac: command + option + n

1.3.2 橫向多列插入
windows: 按下 alt 選擇 多列
mac:按下option 選擇? 多列


1.4 csv 和 markdown 查看工具
? 1.4.1 你還在為,wps 或者 office中,自動轉換 文本為數(shù)字煩惱嗎?




1.4.2 你還在拼命尋找一款免費的markdown編輯器?

1.5 命令區(qū)

1.5.1 大小寫轉換

1.5.2 排序

1.5.3 合并行



2. 前端篇
2.1 安裝vetur插件

2.2 你還在煩惱沒有找到 npm 腳本嗎,看這里

2.3 前端開發(fā)配置參考
? //前端相關
? ? "[vue]": { //vuejs 格式化問題
? ? ? ? "editor.defaultFormatter": "octref.vetur"
? ? },
? ? "vetur.format.defaultFormatter.html": "js-beautify-html",
? ? "vetur.format.defaultFormatter.js": "prettier",
? ? "vetur.format.defaultFormatterOptions": {
? ? ? ? "js-beautify-html": {
? ? ? ? ? ? "wrap-attributes": "aligned-multiple",
? ? ? ? ? ? "wrap-attributes-indent-size": 4,
? ? ? ? ? ? "wrap-line-length": 150,
? ? ? ? ? ? "indent_size": 2, //兩個空格位置
? ? ? ? },
? ? ? ? "prettier": {
? ? ? ? ? ? "tabWidth": 2, //兩個空格位置
? ? ? ? ? ? "printWidth": 200,
? ? ? ? ? ? "singleQuote": false,
? ? ? ? ? ? "jsxBracketSameLine": true,
? ? ? ? },
? ? },
? ? "[javascript]": {? ? //JavaScript 格式化問題
? ? ? ? "editor.defaultFormatter": "HookyQR.beautify"
? ? },
? ? "[json]": {
? ? ? ? "editor.defaultFormatter": "HookyQR.beautify"
? ? },
? ? "editor.tabSize": 4,
? ? "editor.fontSize": 13,
? ? "editor.wordWrap":"wordWrapColumn",
? ? "editor.wordWrapColumn": 160,
? ? "editor.suggestSelection": "first",
? ? "editor.quickSuggestions": {
? ? ? ? "strings": true
? ? },
3. 后端篇
3.1 遠程開發(fā)(你還在為vim,操作不便煩惱嗎?)
3.1.1 安裝 Remote Development 插件包

3.1.2 按照步驟連接終端



3.1.3. 編輯文件





若有收獲,就點個贊吧~