Mac环境下如何配置Vue？一文就够！_mac vue 安装最详细

1.安装Homebrew

Homebrew 是类似于 Mac App Store 的一个软件商店，对于Mac用户是必不可少的！如果没有安装的话，只需要在终端复制下面这段代码即可。

/bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"
1

测试 Homebrew 是否正确安装
输入brew -v 出现版本信息即为安装成功。

2.安装node.js

已经安装Homebrew后，我们就用brew来安装 在终端中输入以下代码（也可以在官网 nodejs链接下安装）

brew install nodejs
1

安装完成后输入

node -v
nom -v
1
2

若出现版本信息即为安装成功

3.安装cnpm

为了提高我们的效率，可以使用淘宝的镜像：http://npm.taobao.org/ ，在终端中输入以下代码：

npm install -g cnpm --registry=https://registry.npm.taobao.org
1

4.安装Vue.js

选择用package manager工具-npm ，在终端中输入以下代码：

npm install -g vue-cli
1

5.创建Vue项目

vue init webpack project_one
1

“project_one” 替换成自己的项目名称即可。
接下来会出现一些设置选项，按步骤输入项目信息，注意Project name不支持大写字母为项目名，项目创建好后，它也给出了提示信息，继续操作即可。可以根据自己的需要进行选择，也可以直接按回车默认选项。

安装参数说明：
Vue build => 打包方式，回车即可；
Install vue-router => 是否要安装 vue-router 要 Y 回车；
Use ESLint to lint your code => 是否需要 js 语法检测 不要 n 回车；
Set up unit tests => 是否安装 单元测试工具 不要 n 回车；
Setup e2e tests with Nightwatch => 是否需要 端到端测试工具 不要 n 回车；

6.安装组件

每一个项目都有一个package.json文件，里面有很多组件信息，使用npm install将按照package.json安装所需要的组件放在生成的node_modules文件夹中，项目下的每一个文件中都可以通过import引入node_modules的组件来加以使用,在终端中输入以下代码：

cd my-project
npm install
1
2

cd进入项目目录，安装依赖

7.安装 vue 路由模块vue-router和网络请求模块vue-resource

cnpm install vue-router vue-resource --save
1

8.启动服务器

npm run dev
1

报错总结

启动项目报错：
webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
解决办法：
1.先删除模块 2.下载重装webpack-dev-server 3.重新 npm run dev

npm uninstall webpack-dev-server

npm install webpack-dev-server@2.9.1

npm run dev
1
2
3
4
5