vue cli 环境搭建

vue cli是一个快速构建vue单页面应用（SPA）的脚手架（不适合新手使用，因为有太多需要了解的东西，如：node.js、npm、webpack等）。

 

vue cli 环境搭建步骤：

1，安装node.js（官网：https://nodejs.org/zh-cn/）

在官网下载一个稳定版本的node.js安装包进行安装，安装成功后，用管理员打开命令工具，可以查看当前安装好的node.js的版本号和npm（node.js 包管理器，node.js安装好后就有了）版本号，国内下载项目可能会比较慢，所以需要使用淘宝的代理。

// 查看node.js的版本

node -v 

// 查看npm的版本

npm -v

// 设置淘宝的代理，设置代理后，就可以使用 cnpm 来安装了

npm install -g cnpm --registry=https://registry.npm.taobao.org

 

2，安装webpack（打包工具）

// 安装命令，这里可以使用 cnpm来安装，避免因网络问题安装失败

npm install webpack -g

// 查看webpack的版本

webpack -v

 

3，安装vue cli（vue的命令行工具）

// 命令

npm install vue-cli -g

// 查看vue cli版本

vue --version

 

4，新建项目

// 命令

vue init webpack 项目名

 

5，安装项目依赖（进入项目所在目录进行安装）

// 命令

npm install

// 运行项目

npm run dev

// 打包（需要注意修改路径，config->index.js中assetsPublicPath的值修改为 ./）

npm run build

 

6，如果是下载的项目，则直接进入项目的路径下执行 步骤5的操作即可