vue 安装 环境搭建

需先安装node，在根目录安装，若是windows就安装c盘。安装完node会自带npm，npm -v检测

node下载地址：http://nodejs.cn/download/

mac安装需要获取root权限，输入 sudo -s 会提示输入密码，完成即可安装

提示权限不足是需要加sudo

安装webpack  -g 表示全局安装

npm install webpack -g

确认NPM和的Webpack是否安装。

// 检测 node   
node -v  
// 检测 npm  
npm -v  
// 检测 webpack  
webpack -v  

出现版本号为已安装。

安装VUE的几种方法：

 

// 全局安装  
npm install -g vue-cli  
// 淘宝镜像安装  
npm install -g cnpm --registry=https://registry.npm.taobao.org/  
// 安装完成后检测是否安装成功  
vue -V 

创建项目

选择要放项目的文件夹

// 自定义项目  
vue init webpack demo

图片用的是之前Windows版本，提示信息都一样

项目安装完成，进入自己创建的项目文件夹

// 安装依赖  
cnpm install
// 启动项目  
npm run dev 

如果端口冲突可在配置里index.js下修改

autoOpenBrowser: true, //自动打开浏览器

配置完成，浏览器会自行启动，实时刷新页面。

按需安装各种组件

// 安装路由  
cnpm install vue-router  
// 安装sass  
cnpm install sass-loader  
// 安装node sass  
npm install node-sass  
// 安装echarts  
cnpm install echarts --save
// 安装验证组件  
cnpm install vee-validate  
// 安装style-loader  
npm install stylus-loader css-loader style-loader --save-dev    
// 如果stylus安装失败可单独安装  
npm install stylus  
//如使用$api superagent安装： 
cnpm install superagent -D
//安装iview
npm install iview --save
// 安装resource接口请求工具
npm install vue-resource --save-dev
//安装vuex
npm install vuex --save
//通过require的方式来引入css，首先需要安装css-loader，如果需要在js中，require，.less文件，那么我们需要增加包less-loader和less包
npm install font-awesome-webpack less less-loader css-loader style-loader file-loader font-awesome
// 一个自定义滚动插件
npm install vue-seamless-scroll --save

打包

// 项目打包  ctrl+c 终止项目  
npm run build