VSCode 拓展插件推荐——提高 Node 和 Vue 开发效率

xcfp2400 5年前
   <h2>插件列表</h2>    <p><a href="/misc/goto?guid=4959738438827728981" rel="nofollow,noindex">Auto Close Tag</a> 自动闭合HTML标签</p>    <p><a href="/misc/goto?guid=4959738438920340425" rel="nofollow,noindex">Auto Rename Tag</a> 修改HTML标签时,自动修改匹配的标签</p>    <p><a href="/misc/goto?guid=4959738439008786246" rel="nofollow,noindex">Bookmarks</a> 添加行书签</p>    <p><a href="/misc/goto?guid=4959738439086464299" rel="nofollow,noindex">Can I Use</a> HTML5、CSS3、SVG的浏览器兼容性检查</p>    <p><a href="/misc/goto?guid=4959738439172951751" rel="nofollow,noindex">Code Runner</a> 运行选中代码段(支持大量语言,包括Node)</p>    <p><a href="/misc/goto?guid=4959738439255569957" rel="nofollow,noindex">CodeBing</a> 在VSCode中弹出浏览器并搜索,可编辑搜索引擎</p>    <p><a href="/misc/goto?guid=4959738439337963809" rel="nofollow,noindex">Color Highlight</a> 颜色值在代码中高亮显示</p>    <p><a href="/misc/goto?guid=4959738439434202000" rel="nofollow,noindex">Color Picker</a> 拾色器</p>    <p><a href="/misc/goto?guid=4959738439515662385" rel="nofollow,noindex">Document This</a> 注释文档生成</p>    <p><a href="/misc/goto?guid=4959738439600131466" rel="nofollow,noindex">EditorConfig for VS Code</a> <a href="/misc/goto?guid=4959738439684288761" rel="nofollow,noindex">EditorConfig</a> 插件</p>    <p><a href="/misc/goto?guid=4959738439768378408" rel="nofollow,noindex">Emoji</a> 在代码中输入emoji</p>    <p><a href="/misc/goto?guid=4959738439849210279" rel="nofollow,noindex">ESLint</a> ESLint插件,高亮提示</p>    <p><a href="/misc/goto?guid=4959738439947276651" rel="nofollow,noindex">File Peek</a> 根据路径字符串,快速定位到文件</p>    <p><a href="/misc/goto?guid=4959738440026715247" rel="nofollow,noindex">Font-awesome codes for html</a> FontAwesome提示代码段</p>    <p><a href="/misc/goto?guid=4959738440108888349" rel="nofollow,noindex">ftp-sync</a> 同步文件到ftp</p>    <p><a href="/misc/goto?guid=4959738440192308221" rel="nofollow,noindex">Git Blame</a> 在状态栏显示当前行的Git信息</p>    <p><a href="/misc/goto?guid=4959738440283074027" rel="nofollow,noindex">Git History(git log)</a> 查看git log</p>    <p><a href="/misc/goto?guid=4959738440361715175" rel="nofollow,noindex">GitLens</a> 显示文件最近的commit和作者,显示当前行commit信息</p>    <p><a href="/misc/goto?guid=4959738440448036684" rel="nofollow,noindex">Guides</a> 高亮缩进基准线</p>    <p><a href="/misc/goto?guid=4959738440540224098" rel="nofollow,noindex">Gulp Snippets</a> Gulp代码段</p>    <p><a href="/misc/goto?guid=4959738440622884555" rel="nofollow,noindex">HTML CSS Class Completion</a> CSS class提示</p>    <p><a href="/misc/goto?guid=4959738440707271888" rel="nofollow,noindex">HTML CSS Support</a> css提示(支持vue)</p>    <p><a href="/misc/goto?guid=4959738440793379742" rel="nofollow,noindex">HTMLHint</a> HTML格式提示</p>    <p><a href="/misc/goto?guid=4959738440876760589" rel="nofollow,noindex">Indenticator</a> 缩进高亮</p>    <p><a href="/misc/goto?guid=4959738440961871546" rel="nofollow,noindex">JavaScript (ES6) code snippets</a> ES6语法代码段</p>    <p><a href="/misc/goto?guid=4959738441043828165" rel="nofollow,noindex">language-stylus</a> Stylus语法高亮和提示</p>    <p><a href="/misc/goto?guid=4959738441128029765" rel="nofollow,noindex">Lodash</a> Lodash代码段</p>    <p><a href="/misc/goto?guid=4959738441210086036" rel="nofollow,noindex">markdownlint</a> Markdown格式提示</p>    <p><a href="/misc/goto?guid=4959738441295757367" rel="nofollow,noindex">MochaSnippets</a> Mocha代码段</p>    <p><a href="/misc/goto?guid=4959738441371680555" rel="nofollow,noindex">Node modules resolve</a> 快速导航到Node模块</p>    <p><a href="/misc/goto?guid=4959738441454178813" rel="nofollow,noindex">npm</a> 运行npm命令</p>    <p><a href="/misc/goto?guid=4959738441545294232" rel="nofollow,noindex">npm Intellisense</a> 导入模块时,提示已安装模块名称</p>    <p><a href="/misc/goto?guid=4959738441627408289" rel="nofollow,noindex">Output Colorizer</a> 彩色输出信息</p>    <p><a href="/misc/goto?guid=4959738441713203035" rel="nofollow,noindex">Partial Diff</a> 对比两段代码或文件</p>    <p><a href="/misc/goto?guid=4959738441794521557" rel="nofollow,noindex">Path Autocomplete</a> 路径完成提示</p>    <p><a href="/misc/goto?guid=4959738441872992619" rel="nofollow,noindex">Path Intellisense</a> 另一个路径完成提示</p>    <p><a href="/misc/goto?guid=4959738441955100155" rel="nofollow,noindex">Prettify JSON</a> 格式化JSON</p>    <p><a href="/misc/goto?guid=4959738442047432623" rel="nofollow,noindex">Project Manager</a> 快速切换项目</p>    <p><a href="/misc/goto?guid=4959738442134113890" rel="nofollow,noindex">REST Client</a> 发送REST风格的HTTP请求</p>    <p><a href="/misc/goto?guid=4959738442217360527" rel="nofollow,noindex">Settings Sync</a> VSCode设置同步到Gist</p>    <p><a href="/misc/goto?guid=4959738442306022217" rel="nofollow,noindex">String Manipulation</a> 字符串转换处理(驼峰、大写开头、下划线等等)</p>    <p><a href="/misc/goto?guid=4959738442388234222" rel="nofollow,noindex">Test Spec Generator</a> 测试用例生成(支持chai、should、jasmine)</p>    <p><a href="/misc/goto?guid=4959738442466208279" rel="nofollow,noindex">TODO Parser</a> Todo管理</p>    <p><a href="/misc/goto?guid=4959738442556498703" rel="nofollow,noindex">Version Lens</a> package.json文件显示模块当前版本和最新版本</p>    <p><a href="/misc/goto?guid=4959738442645256101" rel="nofollow,noindex">vetur</a> 目前比较好的Vue语法高亮</p>    <p><a href="/misc/goto?guid=4959738442729894815" rel="nofollow,noindex">View Node Package</a> 快速打开选中模块的主页和代码仓库</p>    <p><a href="/misc/goto?guid=4959738442804648179" rel="nofollow,noindex">vscode-icons</a> 文件图标,方便定位文件</p>    <p><a href="/misc/goto?guid=4959738442899431445" rel="nofollow,noindex">VSCode Great Icons</a> 文件图标拓展</p>    <p><a href="/misc/goto?guid=4959738442980991999" rel="nofollow,noindex">VueHelper</a> Vue2代码段(包括Vue2 api、vue-router2、vuex2)</p>    <h3>附录:VSCode首选项配置</h3>    <pre>  {      "editor.tabSize": 2,      "files.associations": {          "*.vue": "vue"      },      "eslint.autoFixOnSave": true,      "eslint.options": {          "extensions": [              ".js",              ".vue"          ]      },      "eslint.validate": [          "javascript",          "javascriptreact",          "vue",          "vue-html"      ],      "search.exclude": {          "**/node_modules": true,          "**/bower_components": true,          "**/dist": true      },      "emmet.syntaxProfiles": {          "javascript": "jsx",          "vue": "html",          "vue-html": "html"      },      "extensions.autoUpdate": true,      "editor.renderWhitespace": "boundary",      "editor.cursorBlinking": "smooth",      "workbench.welcome.enabled": true  }</pre>    <p> </p>    <p>来自:https://github.com/varHarrie/Dawn-Blossoms/issues/10</p>    <p> </p>