文章目录
- 前言
- 一、vscode插件推荐?
- 1、 Chinese (Simplified) (简体中文) Language Pack for Visual Studio Code
- 2、Auto Close Tag
- 3、Auto Import
- 3、Error Lens
- 4、vscode-icons
- 5、ES7+ React/Redux/React-Native snippets
- 6、GitLens — Git supercharged
- 7、JavaScript (ES6) code snippets
- 8、Path Intellisense
- 9、Prettier - Code formatter
- 10、Vetur
- 11、Volar
- 12、Sass (.sass only)
前言
最近因为工作原因换了公司电脑进行办公,所以需要在vscode的安装插件。
一、vscode插件推荐?
括号变成彩色
使用改代码进行配置
"editor.bracketPairColorization.enabled": true,
"editor.guides.bracketPairs":"active"
1、 Chinese (Simplified) (简体中文) Language Pack for Visual Studio Code
实用型插件,vscode的中文(简体)语言包。
2、Auto Close Tag
自动添加 HTML/XML 关闭标记
3、Auto Import
自动查找、解析并提供所有可用导入的代码操作和代码完成。适用于 Typescript 和 TSX
3、Error Lens
改进错误、警告和其他语言诊断的突出显示。
4、vscode-icons
改变编辑器里面的文件图标
5、ES7+ React/Redux/React-Native snippets
敲react代码会很方便,会有一些代码片段,如:rcc(React Class Component);rfc(React Functional Component);clg(console.log())
6、GitLens — Git supercharged
GitLens 只是帮助你更好地理解代码。快速了解更改行或代码块的人员、原因和时间。回顾历史,进一步了解代码如何以及为什么演变。轻松探索代码库的历史和演变。
7、JavaScript (ES6) code snippets
此扩展包含 JavaScript 的代码片段,采用 ES6 语法的 VS 代码编辑器(支持 JavaScript 和 TypeScript)。
8、Path Intellisense
自动完成文件名的Visual Studio Code插件。
9、Prettier - Code formatter
prettier是一个代码格式化程序。它通过解析代码并使用自己的规则(考虑最大行长)重新打印代码,从而使得代码样式一致,并在必要时包装代码。prettier配置完成后代码自动格式化,无需手动调整。
10、Vetur
Vetur是一款Vue代码高亮显示的一款插。
11、Volar
1.在功能上 volar 和 vetur 是一致的,都是针对 vue 的插件,但是 volar 的功能却要强大得多
2.volar 是 vue3 的配套,vetur 是 vue2 的配套,所以,建议大家在使用的时候依据自己使用的 vue 版本来选择。
3.在使用前需要禁用 vetur 以避免冲突
4.推荐使用 css/less/scss 作为<style>
的语言,因为这些基于 vscode-css-language 服务提供了语言支持。如果你使用 postcss/stylus/sass 的话,你需要安装额外的语法高亮扩展。
12、Sass (.sass only)
缩进的Sass语法高亮显示,自动完成和格式化