Mac上安装node和使用vue-cli构建vue项目

1、安装node
安装node，可以到Node 官网nodejs.org，或者国内镜像npm.taobao.org/mirrors/node，下载最新版本的安装包。

我使用的国内镜像

镜像列表

 

7.9.0版本镜像列表

下载后点击安装，安装完成后，命令行执行下面的命令，确认是否安装成功。

 

andedeMacBook-Pro:workspace andewang$ node -v
v7.9.0
andedeMacBook-Pro:workspace andewang$ 

ps:Node 的模块管理器 npm 会一起安装好，不需要另外安装

$ npm -v
4.2.0


如果版本太低，小于4.0，请执行下面命令升级(vue-cli需要npm版本大于4.0)
$ npm install -g npm


切换模块仓库到阿里的源(Node 的官方模块仓库网速太慢)
$ npm config set registry https://registry.npm.taobao.org/

执行下面的命令，确认是否切换成功
$ npm config get registry
https://registry.npm.taobao.org/

2、安装 vue-cli
选择全局安装
$ npm install -g vue-cli

安装成功后，vue命令查看

使用vue list查看vue的模板

3、生成项目
使用webpack 模板生成一个vue的项目

过程总需要填写一些信息，项目名称、项目描述、是否需要安装vue-router、由于只是测试项目，unit test单元测试和ese tests 我选了no

4.进入项目和安装依赖

$cd test-vue

查看当前目录结构

安装依赖

$npm install

安装成功后，可以发现多了一个node_modules目录

5、启动项目

$ npm run dev

> test-vue@1.0.0 dev /Users/andewang/workspace/test-vue
> node build/dev-server.js

> Starting dev server...


 DONE  Compiled successfully in 3041ms                                                                                   11:34:32

> Listening at http://localhost:8080

浏览器查看效果

 

 

 

另外，给大家介绍一款国内很实惠便宜的服务器运营商：

https://www.didiyun.com/activity.html?invite=298tSgEjvtp#annually