摘要:宋體以像素為單位控制字號。將其設置為可隱藏窗格。是否已啟用自動刷新是否啟用自動拉取以像素為單位控制終端的字號,這是的默認值。要求工作區使用高于版本的。
用戶設置
打開 文件 > 首選項 > 用戶設置(U),(忽略覆蓋工作區提示)
{ // 一個制表符等于的空格數。該設置在 `editor.detectIndentation` 啟用時根據文件內容進行重寫。 "editor.tabSize": 2, "editor.lineHeight": 24, "editor.renderLineHighlight": "none", "editor.renderWhitespace": "none", // 控制字體系列。 "editor.fontFamily": ""Fira Code", Consolas, "Courier New", monospace,"宋體"", "editor.fontLigatures": true, // 以像素為單位控制字號。 "editor.fontSize": 14, "editor.cursorBlinking": "smooth", "editor.wordWrap": "on", "editor.formatOnSave": true, "editor.formatOnPaste": true, // 控制選取范圍是否有圓角 "editor.roundedSelection": false, // 建議小組件的字號 "editor.suggestFontSize": 16, // 是否允許自定義的snippet片段提示,比如自定義的vue片段開啟后就可以智能提示 "editor.snippetSuggestions": "top", "editor.quickSuggestions": { "strings": true }, // 執行文字相關的導航或操作時將用作文字分隔符的字符 "editor.wordSeparators": "./()"":,.;<>~!@#$%^&*|+=[]{}`~?", // 在“打開的編輯器”窗格中顯示的編輯器數量。將其設置為 0 可隱藏窗格。 "explorer.openEditors.visible": 0, "git.path": "D:/Program Files/Git/bin/git.exe", // 是否已啟用自動刷新 "git.autorefresh": true, // git是否啟用自動拉取 "git.autofetch": false, // 以像素為單位控制終端的字號,這是 editor.fontSize 的默認值。 "terminal.integrated.fontSize": 14, // 控制終端游標是否閃爍。 "terminal.integrated.cursorBlinking": true, "workbench.startupEditor": "newUntitledFile", "workbench.iconTheme": "eq-material-theme-icons-palenight", "workbench.colorTheme": "Material Theme Palenight High Contrast", "materialTheme.fixIconsRunning": false, "html.suggest.angular1": false, "html.suggest.ionic": false, "files.trimTrailingWhitespace": true, // VScode 文件搜索區域配置 "search.exclude": { "**/dist": true, "**/build": true, "**/elehukouben": true, "**/.git": true, "**/.gitignore": true, "**/.svn": true, "**/.DS_Store": true, "**/.idea": true, "**/.vscode": false, "**/yarn.lock": true, "**/tmp": true }, // 排除文件搜索區域,比如node_modules(貼心的默認設置已經屏蔽了) "files.exclude": { "**/.idea": true, "**/yarn.lock": true, "**/tmp": true }, // 配置文件關聯,以便啟用對應的智能提示,比如wxss使用css "files.associations": { "*.vue": "vue", "*.wxss": "css" }, // 配置emmet是否啟用tab展開縮寫 "emmet.triggerExpansionOnTab": true, // 配置emmet對文件類型的支持,比如vue后綴文件按照html文件來進行emmet擴寫 "emmet.syntaxProfiles": { "vue-html": "html", "vue": "html", "javascript": "javascriptreact", // xml類型文件默認都是單引號,開啟對非單引號的emmet識別 "xml": { "attr_quotes": "single" } }, // 在react的jsx中添加對emmet的支持 "emmet.includeLanguages": { "jsx-sublime-babel-tags": "javascriptreact" }, // 是否開啟eslint檢測 "eslint.enable": true, // 文件保存時,是否自動根據eslint進行格式化 "eslint.autoFixOnSave": true, // eslint配置文件 "eslint.options": { "plugins": [ "html", "javascript", { "language": "vue", "autoFix": true }, "vue" ] }, // eslint能夠識別的文件后綴類型 "eslint.validate": [ "javascript", "javascriptreact", "html", "vue", { "language": "html", "autoFix": true }, "typescript", "typescriptreact" ], // 快捷鍵方案,使用sublime的一套快捷鍵 "sublimeTextKeymap.promptV3Features": true, // 格式化快捷鍵 shirt+alt+F // prettier進行格式化時是否安裝eslint配置去執行,建議false "prettier.eslintIntegration": true, //分號 "prettier.semi": false, // 如果為true,將使用單引號而不是雙引號 "prettier.singleQuote": true, "prettier.tabWidth": 2, "prettier.useTabs": false, // vetur插件格式化使用beautify內置規則 "vetur.format.defaultFormatter.html": "js-beautify-html", //函數前加空格 "javascript.format.insertSpaceBeforeFunctionParenthesis": true, // 沒有下邊這個 上邊不生效 "vetur.format.defaultFormatter.js": "vscode-typescript", // 細節,配置gitlen中git提交歷史記錄的信息顯示情況 "gitlens.advanced.messages": { "suppressCommitHasNoPreviousCommitWarning": false, "suppressCommitNotFoundWarning": false, "suppressFileNotUnderSourceControlWarning": false, "suppressGitVersionWarning": false, "suppressLineUncommittedWarning": false, "suppressNoRepositoryWarning": false, "suppressResultsExplorerNotice": false, "suppressUpdateNotice": true, "suppressWelcomeNotice": false }, // 對不屬于任何工程的 JavaScript 文件啟用或禁用 "experimentalDecorators" 設置。若有 jsconfig.json 或 tsconfig.json 文件,將覆蓋此設置。要求工作區使用高于 2.3.1 版本的 TypeScript。 "javascript.implicitProjectConfig.experimentalDecorators": true, "powermode.enabled": true, "powermode.presets": "flames", // 開啟apicloud在vscode中的wifi真機同步 "apicloud.port": "23450", // 設置apicloud在vscode中的wifi真機同步根目錄 "apicloud.subdirectories": "/apiclouduser", "terminal.integrated.shell.windows": "C:WindowsSystem32WindowsPowerShellv1.0powershell.exe" }用戶代碼片段
打開 文件 > 首選項 > 用戶代碼片段 > (搜索代碼語言)
HTML片段
{ "ss": { "prefix": "ss", "body": [ "" ], "description": "" }, "html5": { "prefix": "html5", "body": [ "", "", "", "", " ", " ", " ", "${1:Document} ", "", "", "", " $2", "", "", "" ], "description": "HTML5" } }
JavaScript / JavaScript React
{ "cl": { "prefix": "cl", "body": [ "console.log($1)" ], "description": "console.log("")" }, "dg": { "prefix": "dg", "body": [ "document.getElementById($1)" ], "description": "document.getElementById(id)" }, "jsdoc": { "prefix": "__", "body": [ "/**", " * $1", " */" ], "description": "/** */" } }快捷鍵設置
// 將鍵綁定放入此文件中以覆蓋默認值 [ // ctrl+shift+d 復制當前行到下一行 { "key": "ctrl+shift+d", "command": "editor.action.copyLinesDownAction", "when": "editorTextFocus && !editorReadonly" }, // ctrl+shift+f 格式化代碼 { "key": "ctrl+shift+f", "command": "editor.action.formatDocument", "when": "editorHasDocumentFormattingProvider && editorTextFocus && !editorReadonly" }, // alt+/ 代碼提示 { "key": "alt+/", "command": "editor.action.triggerSuggest", "when": "editorTextFocus" }, // ctrl+shift+/ 多行注釋 { "key": "ctrl+shift+/", "command": "editor.action.blockComment", "when": "editorTextFocus" } ]插件推薦
提示:VS Code自帶有代碼格式化功能,可以格式化HTML、CSS、JavaScript、JSON文件,格式JSX文件時需要設置縮進方式為空格·
Auto Close Tag (自動關閉HTML標簽) Auto Rename Tag (HTML標簽自動改名) Babel ES6/ES7 VS Code JavaScript (ES6) snippets (ES6語法提示) Beautify css/sass/scss/less Brackets Light (主題) Complete JSDoc Tags (js文檔注釋提示) Git History (查看git提交記錄) HTML CSS Support (HTML中提示可用的class) npm Intellisense (提示可以require的模塊名稱(最新版的vscode已經集成此功能)) One Dark Theme (主題) Path Intellisense (路徑補全) Prettier (格式化,使用標準風格,快捷鍵 alt+shift +F) Reactjs code snippets (reactjs代碼提示) Sass SCSS IntelliSense Sublime Babel Sublime Text Keymap for VS Code (sublime鍵映射) VSCode Great Icons (文件圖標) vscode-icons (文件圖標) HTMLHint (html代碼檢查) HTML Snippets (超級實用且初級的 H5代碼片段以及提示) Document this (js 的注釋模板 (注意:新版的vscode已經原生支持,在function上輸入/** tab)) cssrem (將css中的px自動轉換為rem.再也不用計算器了) Vetur (添加對.vue后綴文件的快速書寫支持) Vue 2 Snippets (快速新建vue頁面)主題、文件圖標推薦
主題我用的是:Atom One Dark Theme(theme-oceanicnext、Dracula)
文件圖標我用的是:VSCode Great Icons
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/81856.html
摘要:前端編程工具有很多,例如簡稱,,,,等等,今天給大家推薦的是是一個完全免費的軟件,頁面簡介大方,是前端開發者最受歡迎的軟件之一。 前端編程工具有很多,例如Visua...
摘要:軟件跨平臺支持以及,運行流暢,可謂是微軟的良心之作微軟有這個宇宙最強,自然也不會弱宇宙最強編輯器說到代碼編輯器,我們有必要提一提還有。 原文鏈接:VS Code上手與超實用插件安利 工欲善其事必先利其器 Visual Studio Code (簡稱 VS Code / VSC) 是一款免費開源的現代化輕量級代碼編輯器,支持幾乎所有主流的開發語言的語法高亮、智能代碼補全、自定義熱鍵、括號...
摘要:由于本身不能個性化配置,有時可能會引起不適,但是至少保證團隊成員可以輕易統一代碼風格。就是將多于一個字母的合成一個字形。自從年雙十一正式上線,累計處理了億錯誤事件,得到了金山軟件等眾多知名用戶的認可。 譯者按: IDE是生產力的保證! 原文:Visual Studio Code Settings and Extensions for Faster JavaScript Develop...
摘要:如果想配置開發工具面向前端及開發人員的配置如果想配置開發工具配置及使用技巧所謂網紅編輯器,我覺得比來的更爽,因為的所有操作和插件,對于來說也就是一個插件就能無縫兼容。作為一個前端開發,開箱即用的代碼編輯高亮提示都十分友好。 如果想配置 sublime 開發工具 => 面向web前端及node開發人員的vim配置 如果想配置 vim 開發工具 => sublime配置及使用技巧 所謂網紅...
摘要:前端配置簡體中文插件,一般會自動識別你的環境,自動提示是否需要簡體中文的語言包。使用插件將目前配置保存到上,以后只需要從上獲取,就可以一次性安裝插件配置信息。 VS code-前端配置 showImg(https://segmentfault.com/img/bVbuK6l?w=1224&h=999); Chinese (Simplified) Language Pack for Vi...
閱讀 2269·2021-11-23 09:51
閱讀 5657·2021-09-22 15:39
閱讀 3343·2021-09-02 15:15
閱讀 3494·2019-08-30 15:54
閱讀 2355·2019-08-30 15:53
閱讀 1397·2019-08-30 14:04
閱讀 2446·2019-08-29 18:33
閱讀 2364·2019-08-29 13:08