目录
友情提醒
先看文章目录，大致了解知识点结构，直接点击文章目录可以跳转到文章指定位置。
第一章、Vue的环境搭建
1.1）什么是node和npm
①Node：是JavaScript的运行时环境。在浏览器中，js是无法操作文件的，而node提供了文件操作。在浏览器中，js无法写服务接口，而node提供了后端代码编写的功能（写后台、操作数据库）。但是我们不会用node写后端，node更多的是给前端项目做配置，如：跨域代理。
②Npm：npm是node提供的一个包管理工具，类似于maven。通过npm去安装依赖包，就不需要在页面上使用script标签引入了。
1.2）node的下载
官网下载地址点击跳转
①点击下载安装，再点击全部安装包
②选择上级目录
③找到v16.18.0版本
④选择windows免安装版本下载，直接解压可用，注意解压的路径不能有中文
1.3）配置node的环境变量
①复制解压的路径
②win+E打开管理器–>此电脑–>属性
③选择高级系统设置
④选择环境变量
⑤点击path并编辑
⑥点击新建，输入刚刚解压的路径： F:\node-v16.18.0
⑦cmd窗口输入node -v测试，出现如下页面表示安装成功
1.4）常见的npm命令
注意： -g是全局安装
//安装脚手架
npm install -g @vue/cli
//卸载vue脚手架
>:npm uninstall vue-cli -g
//强制清除npm缓存：
npm cache clean --force
//再执行安装npm：
npm install -g npm
//npm安装插件
npm install 组件名 -g
//npm卸载插件
npm uninstall 组件名 -g
//npm查看插件
npm list
//设置国内镜像
npm config set registry https://registry.npm.taobao.org
//查看镜像是否切换成功：
npm config get registry
1.5）npm设置国内镜像
①打开IDEA，File—》settings
②tools—>terminal—>修改shellpath—>重启IDEA
③配置后就可以在IDEA中使用命令行了
④设置国内镜像
第二章、脚手架安装
2.1）脚手架安装
①安装命令
//安装脚手架
npm install -g @vue/cli
//卸载vue脚手架
npm uninstall vue-cli -g
②在IDEA中安装脚手架，如果安装失败，卸载重装
③出现如下提示为成功
2.2）用命令创建vue工程
①在terminal输入创建命令
vue create 项目名（名称不能有中文，必须全小写，可用下划线）
②按上下箭头，选择语法模板
③创建成功后提示successful
2.3）vue工程的目录结构
2.4）package.json核心文件内容
