前言

原来一直学习使用React，现在因为工作的需要，对Vue进行学习和使用，现在比较流行的框架React,angular,vue，正好对于vue也进行些了解。

环境搭建

1. 打开终端,安装brew

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

安装成功后，使用查看版本，验证是否安装成功

brew -v

image

2. 安装node.js

brew install nodejs

也可以下载安装下载地址
安装成功后，使用验证

node -v

• 给nodejs目录赋权限

　sudo chmod -R 777 /usr/local/lib/node_modules/

• 安装 淘宝镜像 （npm）

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

• 安装webpack

cnpm install webpack -g

• 安装vue脚手架

npm install vue-cli -g

开始Vue

# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 这里需要进行一些配置，默认回车即可
This will install Vue 2.x version of the template.

For Vue 1.x use: vue init webpack#1.0 my-project

? Project name my-project
? Project description A Vue.js project
? Author runoob <test@runoob.com>
? Vue build standalone
? Use ESLint to lint your code? Yes
? Pick an ESLint preset Standard
? Setup unit tests with Karma + Mocha? Yes
? Setup e2e tests with Nightwatch? Yes

   vue-cli · Generated "my-project".

   To get started:

     cd my-project
     npm install
     npm run dev

   Documentation can be found at https://vuejs-templates.github.io/webpack

进入项目，安装并运行：

$ cd my-project
$ cnpm install
$ cnpm run dev
 DONE  Compiled successfully in 4388ms

> Listening at http://localhost:8080

image