Mac OS X下安装Vue脚手架（vue-cli）

前言

Vue做为前端三大框架（Angular，React，Vue）之一，号称是最简单，最容易上手的框架，同时也是行内的大趋势，还能够用来开发最火的小程序。具备开发快，双向数据流等特色，有些人认为Vue是Angular和React的结合，既有Angular的模板语法也有React的组件化体系，以致于促使其发展飞快。
下面来就来说讲Vue脚手架（vue-cli）的安装吧。

安装vue（使用npm 推荐）

# 全局安装 vue-cli
$ npm install --global vue-cli
# 建立一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 安装依赖，走你
$ cd my-project
$ npm install
$ npm run dev

当使用npm install --global vue-cli命令时报：npm: command not found的解决办法。

一、重装nodejs。
二、依次执行下面的命令：

sudo apt-get remove npm
sudo apt-get remove nodejs-legacy
sudo apt-get remove nodejs 
sudo rm /usr/bin/node 
sudo apt-get install nodejs 
sudo apt-get install nodejs-legacy 
sudo apt-get install npm

执行上面命令的时候会出现：sudo: apt-get: command not found，缘由是apt-get是debian(Ubuntu)才有的包管理器。

一、解决办法一：使用brew代替apt-get
What is brew?
brew 全称Homebrew，是Mac OSX上的软件包管理工具，能在Mac中方便的安装软件或者卸载软件。
如何安装？
安装只须要在终端下输入下面一条命令（Mac自带ruby不须要安装）

ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

安装完成后使用brew install libxml2便可。如需查看brew的更多功能请使用brew --help查看其帮助文档。
二、解决办法二：Fink 安装过程这里就再也不阐述，有兴趣的能够去看看，传送门Fink的安装

brew安装好以后就能够依次执行下面的命令：

brew remove npm
brew remove nodejs-legacy
brew remove nodejs
brew rm /usr/bin/node
brew install nodejs
brew install nodejs-legacy
brew install npm

继续执行npm install --global vue-cli安装架手架，发现npm不能安装模块。缘由是proxy的问题，要求node版本是node-6.2.1。

执行下面命令：

npm config rm proxy
npm config rm https-proxy

Mac中在/Users/YourUserName下找不到.bash_profile则本身建立.bash_profile文件。运行下面命令：

cd /Users/YourUserName //进入文件目录位置
touch .bash_profile   //建立文件
open －e .bash_profile //打开并编辑（文件可为空）
source .bash_profile  //编辑保存了执行这句编译下

上面步骤操做完了，再执行：npm install --global vue-cli，如今能够执行了。

当执行vue init webpack my-project时若是报：bash vue :command not found，这个提示是指没有成功的安装vue-cli，从新执行npm install --global vue-cli全局安装就能够了。

上面讲的是用npm安装，固然你也能够用yarn。想用yarn安装，就必须用npm安装一下yarn。执行命令：npm install -g yarn

修改全局路径为默认路径：

npm root -g //查看本机全局的npm包的安装路径
npm config set prefix /usr/local //修改全局路径为默认路径
npm -v //能够看到nodejs相应的版本号

建立新项目

cd /Users/app/Downloads/project
vue init webpack my-project(项目名字)  //建立新项目

//建立项目以前会询问你项目相关信息，信息以下：

? Project name my-project    //设置项目名称
? Project description my-project app  //设置项目描述
? Author Martyr    //设置做者
? Vue build standalone    //使用标准的文件或是压缩过的文件（标准）
? Install vue-router? Yes    //是否安装vue-router（路由）
? Use ESLint to lint your code? No    //是否使用语法检查器（检查十分严格）
? Pick an ESLint preset Standard    //用何种（选择标准便可）
? Set up unit tests NO    //是否使用单元测试
? Setup e2e tests with Nightwatch? No    //是否使用e2e测试
? Should we run `npm install` for you after the project has been cre
ated? (recommended) npm    //是否须要如今经过npm或yarn帮你配置项目，或是稍后你本身动手安装
安装完成后出现运行项目的相关提示：
cd my-project    //进入my-project文件夹
npm install //安装依赖；
npm run dev //运行项目

最后，浏览器地址栏输入：http://localhost:8080回车，新建的vue-cli模板项目就运行了。

附：
在项目里安装Vux移动端

npm install vux --save
npm install vux-loader --save-dev //安装vux 必须安装vux-loader 不然报错

安装weex开发APP

//全局安装 weex-toolkit 在app下执行就能够
sudo npm install -g weex-toolkit //安装
appdeMacBook-Pro: app$ weex -v //查看版本号，出现以下显示则安装成功
   v1.3.11
 - weex-builder : v0.4.0
 - weex-previewer : v1.5.1

相关资料

建立Vue项目 以及引入Iview
npm: command not found的解决方案
Mac OSX下使用apt-get命令
vue新建项目（-）vue-cli安装
Mac 打开、编辑 .bash_profile 文件