vscode,
分享于 点击 46530 次 点评:85
vscode,
vscode最佳配置
配置说明详解
- vscode配置内容在最后,已附上。可直接copy使用
editor是针对vscode的风格设置
例如 tabSize:一个tab等于2个空格,行高为24pxworkbench是针对vscode的主题设置
例如 iconTheme( 图标风格):使用插件 vscode-great-icons (需搜索安装)
例如 colorTheme(代码颜色风格):使用插件One Dark Pro Vivid(需搜索安装)search.exclude 配置vscode中在项目中的哪些地方被排除搜索
files.associations 配置文件关联,比如
“files.associations”: {
“*.vue”: “vue”,
“*.wxss”: “css”
}
任何wxss后缀的文件会被认为是css文件 ,然后vscode会用css规则去显示代码风格,给出加载对应文件格式插件sync是用于同步vscode配置使用,不用每一次换个电脑都要复制,很容易丢失或者改动,无法保持一致!
apicloud 是用于同步vscode开发apicloud程序时进行手机wifi真机同步使用,不用数据线。
vscode插件安装
- Atom One Dark Theme 主题
- VSCode Great Icons 图标主题
- Beautify 美化vscode代码
- Bracket Pair Colorizer 每一对括号用不同颜色区别 (括号强迫症必备)
- cssrem 将css中的px自动转换为rem.再也不用计算器了(大漠大神推介)
- Code Runner node,python等代码不必开命令行即可运行
- Eslint 语法检测
- Git History git提交历史
- GitLens 在代码中显示每一行代码的提交历史
- HTML CSS Support vscode对html,css文件支持,便于你快速书写属性
- Path Intellisense 路径识别苦战,比如书写图片路径时。遗憾就是,对webpack项目中的路径别名无法扩展
- Prettier 格式化,使用标准风格,快捷键 alt+shift +F
- Python 添加对.py文件的支持,毕竟tab与空格的痛苦写过python的都知道
- React Native Tools 添加对 React Native项目的支持,快速书写es6以及jsx
- C/C++ 运行React Native项目时,有些文件的查看需要这个
- Settings Sync 用于同步vscode配置,多台电脑一份配置(相对而言配置复杂,可不安装)
- Sublime Text Keymap 启动sublimeText的快捷键配置。vscode上面自有一套快捷键设定,个人习惯sublime快捷键
- Vetur 添加对.vue后缀文件的快速书写支持。
- Vue 2 Snippets 快速新建vue页面(参考我另一篇文章)
- markdownlint 书写md文件的预览插件
- language-stylus CSS预处理器styl后缀文件的识别扩展
- View In Browser 迅速通过浏览器打开html文件
{ // VScode主题配置 "editor.tabSize": 2, "editor.lineHeight": 24, "editor.renderLineHighlight": "none", "editor.renderWhitespace": "none", "editor.fontFamily": "Consolas", "editor.fontSize": 15, "editor.cursorBlinking": "smooth", "editor.multiCursorModifier": "ctrlCmd", "editor.formatOnPaste": true, // 是否允许自定义的snippet片段提示,比如自定义的vue片段开启后就可以智能提示 "editor.snippetSuggestions": "top", "workbench.iconTheme": "vscode-great-icons", "workbench.colorTheme": "One Dark Pro Vivid", "workbench.startupEditor": "newUntitledFile", "html.suggest.angular1": false, "html.suggest.ionic": false, "files.trimTrailingWhitespace": true, // vetur插件格式化使用beautify内置规则 "vetur.format.defaultFormatter.html": "js-beautify-html", // 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": false, // 文件保存时,是否自动根据eslint进行格式化 "eslint.autoFixOnSave": false, // eslint配置文件 "eslint.options": { "plugins": [ "html", "javascript", { "language": "vue", "autoFix": true }, "vue" ] }, // eslint能够识别的文件后缀类型 "eslint.validate": [ "javascript", "javascriptreact", "html", "vue", "typescript", "typescriptreact" ], // 快捷键方案,使用sublime的一套快捷键 "sublimeTextKeymap.promptV3Features": true, // 格式化快捷键 shirt+alt+F // prettier进行格式化时是否安装eslint配置去执行,建议false "prettier.eslintIntegration": true, // 如果为true,将使用单引号而不是双引号 "prettier.singleQuote": true, // 细节,配置gitlen中git提交历史记录的信息显示情况 "gitlens.advanced.messages": { "suppressCommitHasNoPreviousCommitWarning": false, "suppressCommitNotFoundWarning": false, "suppressFileNotUnderSourceControlWarning": false, "suppressGitVersionWarning": false, "suppressLineUncommittedWarning": false, "suppressNoRepositoryWarning": false, "suppressResultsExplorerNotice": false, "suppressUpdateNotice": true, "suppressWelcomeNotice": false }, // 开启apicloud在vscode中的wifi真机同步 "apicloud.port": "23450", // 设置apicloud在vscode中的wifi真机同步根目录 "apicloud.subdirectories": "/apiclouduser", // git是否启用自动拉取 "git.autofetch": true, }
相关文章
- 暂无相关文章
用户点评