从头开始安装vue

原创 2018年04月17日 15:07:21
        1.先从node.js官网下载并安装node,安装过程很简单


2.npm版本需要大于3.0 ,如果低于3.0要升级它:
查询npm版本号代码: npm-v
升级npm代码: npm install npm -g


3.基于node.js利用淘宝npm镜像安装相关依赖(国内使用npm会很慢),完成后就可以用cnpm代替npm来安装依赖包了
安装cnpm代码: npm install -g cnpm --registry=https://registry.npm.taobao.org


4.安装全局vue-cli脚手架,用于帮助搭建所需的模板框架
cnpm install vue-cli -g
回车,等待安装...
vue -V
回车,若出现版本号说明安装成功


5.下面开始创建新项目
cd 进入你想安装vue的路径
vue init webpack my-project
回车,等待
出来? Project name my-project时,意思是:项目名称(my-project)? 回车
出来? Project description A Vue.js project 回车
出来? Author runoob <test@runoob.com> 回车
出来? Vue build... 回车
出来? Install vue-router? N
出来? Use ESLint to lint your code? Y
出来? Pick an ESLint preset Standard 回车
出来? Setup unit tests with Karma + Mocha? Y
出来? Setup e2e tests with Nightwatch? Y

有个信息出来后就创建完成了


6.开始安装依赖包
cd 进入自己的项目(有个build文件夹的路径)

cnpm install
回车,等待一小会
上一步等待完成后,回到项目文件夹,会发现多了一个node_modules文件夹,这个文件夹里面放的就是刚才安装的依赖包,也可以叫插件


7.试一下环境是否搭建成功
cd 进入自己的项目(有个build文件夹的路径)
npm run dev
在浏览器里输入: localhost:8080(默认端口是8080,修改端口,在config里面的index.js里改)


如果出现(error: Uncaught exception 'RedisException' with message 'Redis server went away' in D:\APMS\www\exyvip\client\application\library\phpredis.php on line 154) 版本太低了?


8.全局安装swiper幻灯片依赖包
cnpm i vue-awesome-swiper --save


第二步要在main.js中引入swiper:
import Vue from 'vue'
import VueSwiper from 'vue-awesome-swiper'
Vue.use(VueSwiper)


9.全局安装sass依赖包
cnpm i node-sass sass-loader --save    
收藏助手
不良信息举报
您举报文章:从头开始安装vue
举报原因:
原因补充:

(最多只允许输入30个字)