0x1.开发环境准备:
笔者环境:Mac
1.HomeBrew准备
HomeBrew是Mac OSX上的软件包管理工具,能在Mac中方便的安装软件或者卸载软件, 只需要一个命令, 非常方便,brew类似ubuntu系统下的apt-get的功能。
安装命令:ruby -e "$(curl -fsSL https://raw.github.com/mxcl/homebrew/go)"
查看版本:brew -v
有了brew我们就可以很方便的在电脑安装各种软件,
安装软件命令: brew install XXX 卸载软件命令:brew uninstall XXX
更多用法请参考官方文档:Homebrew
2.安装NodeJs
进入终端:brew install node
等待安装完成,同样查看一下版本:node -v (笔者v7.5.0)
3.NPM管理工具
NPM是随NodeJs一起安装的包管理工具,能够很方便地安装node开发过程中所依赖的包(模块),提升node开发效率。
安装命令:npm install XXX -g(全局安装,将会写入系统环境变量;非全局安装将会写入当前目录) 如遇到无法写入目录问题,在开头加入sudo
卸载命令:npm uninstall XXX
在国内使用你npm下载的速度会比较慢,建议使用淘宝镜像.
淘宝镜像安装:npm install -g cnpm --registry=https://registry.npm.taobao.org
0x2.Vue.js
vue.js是由尤雨溪大神所开发的一个JavaScript MVVM库,Vue.js的思想是数据驱动和组件化,同时吸收了React.js和Angular.js的优点。
特点:正如官网所说简洁易用、轻量灵活、数据驱动、模块化
Vue.js官网地址:vue.js
Vuejs的安装
使用上文所提到的NPM管理工具进行安装,NPM能够很好地结合webpack模块打包器进行应用开发。
进入终端:
npm install -g vue-cli (vue-cli 是vue.js的脚手架用于自动生成项目模板)
vue-cli github地址:vuejs/vue-cli
安装完成后即可创建我们的第一个项目:
进入终端:
cd 切换到创建项目的目录下:
Vue init webpack <my-project>(项目名称) #创建一个基于webpack模板的新项目
cd my-project 切换到我们项目的目录下
cnpm install 安装所依赖的module
安装完成后,就到了最后一步。
npm run dev #将项目跑起来
如无意外,你将看到以下:
项目在终端中显示运行程控,监听8080端口
以及在浏览器中打开http://localhost:8080,项目环境成功。
那么整个环境篇章我们先到这里结束,下一篇我们将进入项目实战。如果我的文章能让你有所收获,可以关注一下我的公众号:lijahaTalk