Vue 学习笔记（4）Vue-cli4 项目搭建 + 目录结构 + 项目打包、部署

Node.js 环境准备

---

1. 前往这里下载 Node.js：http://nodejs.cn/download/

2. 配置 Node.js 环境变量；（建议百度）

3. 使用 node -v 验证 Node.js 是否安装成功

npm 介绍：

nodejs包管理工具（node package mangager）:

• npm 对前端主流技术进行统一管理

• 可以将 nodejs 想象成 Maven：

maven 管理 java 后端依赖 — 远程仓库(中心仓库) — 阿里云镜像；

npm 管理前端系统依赖 — 远程仓库(中心仓库) — 配置淘宝镜像；

Node.js 配置淘宝镜像：

npm config set registry https://registry.npm.taobao.org

查看 Node.js 配置的远程仓库：

npm config get registry

Node.js 配置 npm 依赖下载位置：（位置自定义）

npm config set cache “D:\CodeTool\nodereps\npm_cache”

npm config set prefix “D:\CodeTool\nodereps\npm_global”

验证 Node.js 环境配置：

npm config ls

安装 Vue 脚手架

---

Vue CLI 官网：https://cli.vuejs.org/zh/guide/

npm uninstall -g @vue/cli # 卸载3.x版本脚手架

npm uninstall -g vue-cli # 卸载2.x版本脚手架

安装 3.x 版本的 Vue CLI：

npm install -g @vue/cli

验证安装成功：（如果显示无法识别 “vue”，需要将 vue.cmd 配置到环境变量）

vue --version

第一个 Vue 脚手架项目

============================================================