安装Vue-cli脚手架的步骤

安装并验证node.js

安装nodejs,下一步下一步就可以,可以安装最新的15版本,win7的话可以安装14版本.使用以下dos命令提示符下执行

node -v     # v8.11.3，至少8以上,最新的是v15.11.0

配置npm

Nodejs下的包管理器,Nodejs中包含了npm,无需单独安装.默认去官网下载资源,可以换成国内的镜像

npm config get registry # 查看当前配置的镜像，结果是默认的国外网址https://registry.npmjs.org/

npm config set registry https://registry.npm.taobao.org #设置成淘宝镜像

npm config get registry #再获取查看,结果是修改后的https://registry.npm.taobao.org/ 

参数说明

注意大小写

-i 安装指令，全拼： install
-S 生产环境，全拼： --save
-D 开发环境，全拼： --save—dev
-O 可选依赖，全拼： --save—optional
-E 精确安装指定模块版本，全称：--save—exact
-g 全局安装，全拼： --global

脚手架的安装

vue-cli: 用户生成Vue工程模板（帮你快速构建一个vue的项目，也就是给你一套vue的结构，包含基础的依赖库）
vue-cli: 脚手架工具安装与配置（需要几分钟）

npm install vue-cli -g #安装vue-cli脚手架---可能比较慢,要等几分钟

npm uninstall vue-cli -g #卸载vue-cli脚手架 --- 大可不必

vue –V #查看版本

where vue #vue安装在哪里

创建vue项目npm

工作空间

进入要存放的目录，并创建文件夹，例如：D:\workspace\vue

生成vue项目

基于vue.js的官方webpack模板：(乱码无需理会)
webpack: 它主要的用途是通过CommonJS的语法把所有浏览器端需要发布的静态资源做相应的准备，比如资源的合并和打包

vue init webpack jt01 #此处项目名不能使用大写---可能比较慢,要等

然后根据这个图片进行操作

成功后的样子：

注：
  jt01 为自定义的 项目名称
  产生项目webpack模板，目录100+m，可见内容多复杂，庞大
  会自动生成node_modules临时目录，可以删除，每次编译、运行会自动产生

启动项目

cd jt01 # 进入项目目录

npm run dev # 自动启动服务，ctrl+c 停止,可能要等几分钟

关闭项目

直接把cmd窗口关闭或按ctrl+c

安装成功后，以后想要打开其他vue项目通过命令vue ui即可(在cmd窗口下)