VS Code mountable
Skilled in the use of software VS Code
VS Code can install the most commonly used plug-ins
VSCode Profile
Visual Studio Code (abbreviated VS Code / VSC) is Microsoft launched a free open source lightweight modern code editor that supports almost all mainstream development language syntax highlighting, smart code completion, GIT and other features, support plug-in extensions and so on.
Recommended reason:
Open source than the sublime, lighter than webstorm
Very powerful smart tips
Comes emmet
Plug-in installation is very easy
Comes with powerful debugging features
Cross-platform software support Win, Mac and Linux.
VSCode installation
Download the official website: https://code.visualstudio.com/
installation steps:
Fool installation, you can direct the next step.
- If you need to change the default installation path, the choice of the target position directly modified.
[Pictures of foreign chains dump fails, the source station may have a security chain mechanism, it is recommended to save the picture down directly upload (img-IwCeiXpq-1576901144081) (C: \ Users \ SuperHan \ AppData \ Roaming \ Typora \ typora-user-images \ 1538966028740.png)]
For future ease of use, it is recommended to create a desktop shortcut.
[Pictures of foreign chains dump fails, the source station may have a security chain mechanism, it is recommended to save the picture down directly upload (img-9wTTW3WE-1576901144084) (C: \ Users \ SuperHan \ AppData \ Roaming \ Typora \ typora-user-images \ 1538966181746.png)]
VSCode use
File directory management
- Select File, then Open Folder, open the folder.
The main interface is divided into EXPLORER (Explorer interface) and code editing page.
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-tepRP7yv-1576901144087)(C:\Users\SuperHan\AppData\Roaming\Typora\typora-user-images\1538967582843.png)]
颜色主题
- 设置首选项按钮 -- Color Theme
在弹出的选择主题界面,选择喜欢的主题界面即可。其中Monokai是与sublime一致的风格。
[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-YkE3UzUH-1576901144092)(C:\Users\SuperHan\AppData\Roaming\Typora\typora-user-images\1538969427638.png)]
其他操作
放大缩小视图:ctrl + 加号 和 ctrl + 减号
向上复制一行:alt+shift+↑
向下复制一行:alt+shift+↓
当光标点击到某一行时,默认选中全行,可以直接复制粘贴
VSCode 插件安装
安装方法
点击左侧《扩展》图标,在搜索框输入需要安装的插件名称,点击install进行安装即可。安装完毕,需要重新加载软件使插件生效。
推荐安装的插件
插件 | 作用 |
---|---|
Chinese (Simplified) Language Pack for VS Code | 中文(简体)语言包 |
Open in Browser | 右击选择浏览器打开html文件 |
JS-CSS-HTML Formatter | 每次保存,都会自动格式化js css 和html 代码 |
Auto Rename Tag | 自动重命名配对的HTML / XML标签 |
CSS Peek | 追踪至样式 |
注意:插件安装需要联网。
禁用或卸载已安装的插件
在扩展界面,点击“更多操作”(三个点),选择“显示安装的扩展”,在列表中找到需要禁用的插件,点击“禁用”或者“卸载”即可。同样操作完毕需要重新加载生效。
[Pictures of foreign chains dump fails, the source station may have a security chain mechanism, it is recommended to save the picture down directly upload (img-7QHlFYtH-1576901144096) (C: \ Users \ SuperHan \ AppData \ Roaming \ Typora \ typora-user-images \ 1538971382289.png)]