vue学习（1） 搭建开发环境

1.安装NodeJS(http://nodejs.cn/download/)根据自己的系统进行下载，然后傻瓜式安装

2.打开cmd命令行，输入npm -v，如果出现如下图的显示，说明已经安装正确

 

 

 3.直接安装淘宝镜像（坑），国内NPM速度“喜人”

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

4.如果你安装的是旧版本的 npm，可以很容易得通过 npm 命令来升级。

sudo npm install npm -g #linux
npm install npm -g　　# windows

5.安装 webpack

安装好 npm 之后，就可以通过 npm 命令来下载各种工具了。

安装打包工具 webpack，-g 表示全局安装

npm install webpack -g

6.安装 vue-cli

安装 vue 脚手架项目初始化工具 vue-cli，-g 表示全局安装。

npm install vue-cli -g

 

7.创建项目

环境已经搭建完成，现在我们通过 vue-cli 来生成一个项目，名称为 tpads-ui。

vue init webpack tpads-ui

一路根据提示输入项目信息，等待项目生成。

 

 命令执行完毕，生成项目结构如下

 

 

 进入到项目根目录，执行 用 npm install，或淘宝 cnpm install， 安装依赖包。

cd tpads -ui
cnpm install

依赖包安装完成之后，会在项目根目录下生成 node_modules 文件夹，是下载的依赖包的统一存放目录。

 

然后运行生成的项目

npm run dev

 

 

 

 出现此页面代表运行成功。。。。。。

浏览器访问对应地址，如这里的: http://localhost:8080，会出现 vue 的介绍页面。