安装vue-cli脚手架

2017-09-11  本文已影响0人  立的flag一直在倒

在一个由于睡不好而异常暴躁的周末,我居然做起安装vue-cli这件事……是的,半天没安装成功的我更暴躁了【捂脸】。于是,开始骚扰已经会用vue的朋友给我指点迷津,就这样,我把人家的散步之旅,变成了全程给我讲解怎么安装vue-cli,罪过罪过。
好了,进入正题,以下是纯文字的笔记部分~

1、安装node.js,一般安装4或4以上的版本,装完之后在控制台键入node -v,能显示版本信息则安装完毕。npm作为node.js的包管理工具,在安装node.js的时候也一起安装好了,可以查看版本信息:
$ npm -v

2、安装全局vue-cli
就是这里!!!根据vue.js官网的安装指南,在控制台用命令行输入npm install -g vue-cli,半天电脑没动静,我一度怀疑是我的破电脑的问题!后来朋友说,那是国外的镜像,当然半天没反应……我想静静……吐槽完说正事:
由于npm是国外的镜像,下载贼慢不说,有些还可能下载失败,这个就很麻烦了,所以还是装淘宝npm镜像吧。
在vue.js官方文档中有安装的方法,在这里我是选择“通过cnpm使用”这种方式,命令行:
$ npm install -g cnpm --registry=https://registry.npm.taobao.org
//使用
$ cnpm install express
// 全局安装 vue-cli
$ cnpm install --global vue-cli
到这里就成功了一大半啦

3、创建一个基于webpack模板的新项目
$ D: (跳转到D盘,个人打算把项目放到D盘,路径随意)
$ vue init webpack my-project
在这里my-project名字自取

4、安装依赖
$ cd my-project
接下来是一系列的项目信息输入之类的,单选就选默认,y/n就y
$ cnpm install
$ cnpm run dev

就这样,搞定!注意,安装完淘宝npm镜像后要用cnpm命令而不是npm~

后来的后来, 因为种种原因,我把淘宝的cnpm镜像卸载了,然后就装不上去了……
解决方案:不用cnpm,直接用npm,修改npm的仓库地址:
npm config set registry https://registry.npm.taobao.org

上一篇下一篇

猜你喜欢

热点阅读