首页 > 其他 > 详细

2.ionic系列之ionic开发环境搭建(一)

时间:2016-05-13 01:20:07      阅读:136      评论:0      收藏:0      [点我收藏+]

工欲善其事,必先利其器。本文将介绍在windows平台及mac ox平台搭建ionic开发环境的过程。

         1.安装Node.js

            打开Node.js官网:https://nodejs.org/官网有两个版本的node.js一个是LTS(长期支持版本),一个是Current当前版本,建议使用LTS版本下载使用。安装时,windows平台安装时一直下一步下一步就OK,mac ox平台直接安装就行。安装完成后windows打开命令行,而mac ox打开终端,输入:

node –v

后回车,若出现node版本号则安装成功。

技术分享

图1 node.js官网


技术分享

图2 node.js安装成功,输入node –v


2.安装cordova

            windows和mac ox分别打开命令行和终端使用以下命令安装cordova

npm install –g cordova

输入

cordova –v

提示cordova版本号则表示安装成功

技术分享
图3 安装成功

3.安装ionic

使用命令安装:

npm install -g ionic

输入

ionic –v

若弹出ionic版本则表示安装成功

技术分享
图4 安装成功

4.创建ionic项目并在谷歌浏览器上调试

使用命令行或终端进入要创建ionic项目的目录输入

ionic start myproject

后输入

cd myproject

可进入创建的项目

输入

ionic serve

将提示输入调试地址提示,输入localhost即可(windows环境下会弹出窗口报错,不用管他,直接在谷歌浏览器中输入http://localhost:8100/#/tab/dash即可,剩下操作和max ox一样),mac ox下将直接自动打开谷歌浏览器,按住command+alt+i键(windows是F12)进入调试模式点击下图中的按钮可预览ionic项目在手机上运行的样子,至此一个完整的ionic官方demo就搭建好了。

技术分享

图5 谷歌浏览器模拟手机


技术分享

图6 demo运行后的样子

2.ionic系列之ionic开发环境搭建(一)

原文:http://blog.csdn.net/book_and_code/article/details/51346000

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!