【VUE】VUE环境+项目搭建详解

一、环境搭建：

1、安装nodejs:

 步骤：在node官网(https://nodejs.org/en/download/ )选择跟自己的电脑匹配的版本进行下载，然后一步步的安装即可，在cmd控制台输入 node -v ，如果出现版本信息即表示安装成功。

2、查看npm包管理器，为了提高效率，安装淘宝镜像安装相关依赖。

1> npm包管理器是集成在node中的，所以直接输入 npm -v 就能查看到版本信息，若出现版本信息则表示npm能正常使用。

2> 输入 npm install -g cnpm --registry=http://registry.npm.taobao.org  ，安装淘宝镜像安装相关依赖。以后再用到npm的地方直接用cnpm来代替就好了

3>检查是否安装成功：cnpm -v

3、安装Vue脚手架vue-cli

1> 执行命令安装：cnpm install vue-cli -g //全局安装 vue-cli

2、检查脚手架安装情况：

vue list

 

 

二、项目搭建

1、进入你的项目目录，创建一个基于 webpack 模板的新项目：

 vue init webpack vue-demo

说明：
Vue build ==> 打包方式，回车即可；

Install vue-router ==> 是否要安装 vue-router，项目中肯定要使用到 所以Y 回车；

Use ESLint to lint your code ==> 是否需要 js 语法检测 目前我们不需要 所以 n 回车；

Set up unit tests ==> 是否安装 单元测试工具 目前我们不需要 所以 n 回车；

Setup e2e tests with Nightwatch ==> 是否需要 端到端测试工具 目前我们不需要 所以 n 回车；
至此模板项目创建成功

2、项目运行：

在控制台，进入项目目录，然后再浏览器输入：http://localhost:8080/，出现“Welcome to Your Vue.js App”，启动成功。
cd vue-demo  

npm run dev