TG项目打卡Day3

这次练习通过 艾编程的VScode教程安装了一系列方便编辑的插件、了解了VScode的一些快捷键、大致了解了Emmet语法和将项目的前端部分运行。

1.VScode实用插件

• Material | icon Theme： 使文件图标更为美观、易于辨别：
  
• Live Server：保存后实时更新网页内容，不需要手动刷新
• Auoto Rename Tag：对于一般标签，实现修改开始标签已修改，结束标签自动修改的功能
• Prettier - Code - fomatter： 实现保存代码后，自动标准化代码布局的效果，使代码更美观、规范

2.VScode快捷键

• 注释/多行注释/取消注释：Ctrl + /
• 上下移动行： alt + up/down
• 向上/下复制当前行： shift + alt + up/down
• 显示/隐藏坐厕目录栏： Ctrl + b
• 控制台/终端/显示/隐藏： Ctrl + ~
• 查找文件/安装的插件： Ctrl + p
• 新建一个窗口： Ctrl + shift + n

3.运行项目的前端文件（Font）

具体化老师和学姐给的教程：

1. 前端代码的运行需要先下载node.js的一个版本，建议选择14左右的版本。可以在官网 下载安装，安装成功后可以通过在命令行输入 node -v 来查看版本信息。

2. 由于npm下载速度较慢，可以使用淘宝镜像地址来安装npm，命令为：npm install -g cnpm -registry=https://registry.npm.taobao.org

3. 接着安装vue脚手架，命令为：npm install -g @vue/cli

4. 下载前端代码后，需要使用命令 npm install 来安装依赖，如果中途报错，可能是因为版本冲突问题。解决方法是升级或降级对应的依赖版本。

5. 最后，使用命令 npm run dev 来运行前端代码。

小结

想要打开前端代码，要安装node，安装脚手架，安装依赖，安装python…
版本不匹配重新搞，搞到了一天心态有点爆炸。

在我尝试最后一次的时候，没有用VScode的终端，而是在cmd中安装所有的东西，这次成功了

总结一点就是，cmd看来和VScode终端原来是有区别的
有一些情况下，使用cmd是必要的，而VSCode终端可能无法实现相同的目标。以下是一些例子（不全）：

• 系统级别的命令：例如修改环境变量、安装系统服务等，这些操作需要管理员权限才能完成，而VSCode终端默认情况下没有管理员权限。

• 特定的第三方命令：有一些第三方工具或库只支持在cmd中使用，例如某些Python库（如pyinstaller）只能在cmd中执行，而不能在VSCode终端中执行。

• 需要交互式输入的命令：有一些命令需要用户的交互输入，例如密码、确认等，而VSCode终端不支持这种交互模式。

• 超长输出的问题：当命令输出结果很多时，VSCode终端可能会出现卡顿或者无法滚动屏幕的问题，而cmd则可以更好地处理这种情况。

4.Emmet语法

Emmet官方文档

• “!”：h5的标准标签
  

• “>”：child

Emmet语法，简直不要太高效！