Vue研习录（01）——基于VS Code安装Vue

---

版权声明

• 本文原创作者：清风不渡
• 博客地址：https://blog.csdn.net/WXKKang

---

  重拾前端记忆，记录学习笔记，现在进入Vue部分

一、什么是Vue

  Vue是优秀的前端框架，是一套用于构建用户界面的渐进式框架
  官网地址：https://vuejs.org/
  中文官网地址：https://cn.vuejs.org/

二、安装Vue工具

  Vue Cli 是Vue.js开发的标准工具，Vue Cli 是一个基于Vue.js进行快速开发的完整系统

npm install -g @vue/cli
//或通过镜像
cnpm install -g @vue/cli

  安装完成之后，通过如下命令行检测是否安装成功

vue -V

三、创建一个项目

  使用下面的命令行来创建一个项目

vue create vue-demo
//注意：项目名称不能存在大写，可用-连接项目名称

  第一步：在要创建的目录【鼠标右键】——【在集成终端中打开】

  第二步：输入vue create 项目名称，回车

---

  题外话：如果出现如上报错信息，处理方式如下：
  （1）使用管理员身份运行PowerShell

  （2）执行set-ExecutionPolicy RemoteSigned ，输入Y，回车

---

  第三步：选择默认项目模板，或者选“手动选择特性”来选取所需要的特性（以“手动选择特性”为例）

使用键盘【上、下】键进行选择
使用【空格】进行选中或取消选中

  第四步：选择Babel和Progressive Web App (PWA) Support

建议取消Linter / Formatter 的选择，以免发生“不必要的麻烦”

  第五步：选择vue版本（以3为例）

  第六步：选择 In dedicated config files 将配置存放在专用配置文件，或选择 In package.json 放置在 package.json 文件中 （以第一个为例）

  第七步：选择是否将本次设置保存为未来项目的预置，y代表保存，n代表不保存

  第八步：等待项目安装

  安装完成

四、运行项目

  通过以下命令行来启动项目

cd 项目名称 //进入项目
npm run serve //启动项目

五、安装高亮插件

  为了更好的开发环境，可在VS Code 中安装高亮插件
  vetur或者volar都可，前者针对Vue2版本，后者针对Vue3版本
  
  以volar为例，选择第一个安装即可