vue.js学习笔记(二)

目录

第二章 关于Visual Studio Code

2.1 介绍 Visual Studio Code

2.2 安装 Visual Studio Code

2.3 使用 Visual Studio Code

2.3.1 界面布局

2.3.2 插件安装

2.3.3 设置

2.3.4 快捷键

2.3.5 git版本控制

2.3.6 debug 调试

---

第二章 关于Visual Studio Code

2.1 介绍 Visual Studio Code

Visual Studio Code (简称 VS Code / VSC) 是一款免费开源跨平台的现代化轻量级代码编辑器，具有以下的优点：

1）支持30多种常用语言的语法高亮，并对html、js、css、Angular等很好的语法支持，并且还支持MarkDown

的预览

2）体积小，功能强大，当然性能也是很好的，打开超大型的文本文件也不会卡死，大家可以和其他的一些文本

编辑器对比一下

3）支持命令操作(Ctrl + Shift + P)和鼠标操作，还有大量的快捷键，可以适应各种开发者的操作习惯

4）支持Git版本控制器，可以完成创建分支、解决冲突、提交修改等操作

5）强大的搜索功能，并且支持多文件搜索

6）最大的有点，当然是跨平台、免费

2.2 安装 Visual Studio Code

VS Code 下载地址：https://www.visualstudio.com/

安装过程比较简单，需要注意的是如果自己指定路径，路径中不要有空格和中文

2.3 使用 Visual Studio Code

VS Code 使用手册：https://code.visualstudio.com/docs

2.3.1 界面布局

2.3.2 插件安装

1）安装浏览器插件，用于访问html页面，在 扩展栏 的搜索框中输入 open in browser 使用 Alt + B 使用默认浏览器打开当前 html 页面，或 Shift + Alt + B 选择其他浏览器

2）安装vue插件（以下的vue相关的一些插件，首先需要先安装Vue 2 Snippets）

Vetur —— 语法高亮、智能感知、Emmet等

Auto Rename Tag —— 自动完成另一侧标签的同步修改

Path Intellisense —— 自动路径补全

HTML CSS Support —— 让 html 标签上写class 智能提示当前项目所支持的样式，安装后有快捷提示

2.3.3 设置

1）开启自动保存文件  file-->auto Save

2）设置字体大小  file-->preferences-->settings（或者快捷键ctrl + 空格也可以打开）

2.3.4 快捷键

官方快捷键：https://code.visualstudio.com/docs/getstarted/keybindings

快捷键pdf文档：https://code.visualstudio.com/shortcuts/keyboard-shortcuts-windows.pdf

2.3.5 git版本控制

git下载地址：https://git-scm.com/

1）本地环境变量配置, 在path中追加git下的cmd目录

2）打开设置窗口，打开并编辑settings.json，添加git.exe的路径

"git.path": "D:/git/Git/bin/git.exe"

注：找到settings后，点击右上角的编辑，编辑json文件，添加git.exe路径，注意斜杠方向，以及上一条后面要加上逗号

2.3.6 debug 调试

官方文档(https://code.visualstudio.com/Docs/editor/debuggin