Ionic入门教程

全篇共 1060 字。按500字/分钟阅读速度,阅读完预计需要 2.1 分钟。

Ionic一款跨平台移动应用开发工具集,你只需用前端能力编写代码,Ionic帮助你把这些代码编译成能在Android、iOS、Windows等移动平台上运行的App。你可以用顺手的前端框架Vue、React或Angular开发你的应用。

创建Ionic项目

首先你的操作系统应该已经安装好最新版本的 Node,并且确保把附带的 npm 升级到最新版本。你可以用类似 nvm 的工具管理 Node 版本,可以用类似 nrm 等工具让你的 npm 更加好用一些。关于 Node 和 npm 的话我说了很多,但我仍觉得还不够。

npm i -g @ionic/cli

我在思考一篇技术文章应该如何组织语言的逻辑和结构的层次,才能让“素未谋面”和“班荆道故”都能带着从容自得的笑容纵我娓娓道来,语言节奏不慢不快,一切都刚刚好。

ionic start learnIonic

执行上面的命令,创建项目 learnIonic。交互式命令行工具提示你用 React 或是 Angular 框架。随后选择 Ionic 官方提供的模版 Blank 或是 TABS 或是 SIDE MENU。

安装Ionic后接下来的步骤提示

cd learnIonic 进入项目 learnIonic 根目录。ionic serve 运行该项目,在弹出的浏览器窗口中预览 App 的模样。把项目目录拖入你用起来顺手的代码编辑器内。当你编辑 src/ 目录下的文件时,刚刚打开的网页就会实时刷新。

Ionic空白项目目录结构

下一步

作为 Ionic 入门教程,到此为止。接下来就是关于 Cordova 和 React 或 Angular 的事情了。Ionic 最重要也是最主要的用途是作为 UI 框架,前往 Ionic 官方网站 学习更完整的使用技巧。用 Cordova 添加平台。用你所熟悉的前端框架 React 或 Angular 开始编写应用。

结语

情动于中而行于言。文章是情的表达方式。完整的学习 Ionic 毋庸置疑需要认真阅读研究官方文档。这篇文章不是 Ionic 官方文档的照搬照抄,而是当我阅读和研究 Ionic 的过程中产生我觉得有意思的想法,想要表达的冲动,和官方文档不一样的感受表达层面或表达方式,情动于中我才有话可说。写文章是对思绪的梳理归纳,对我有益,而对阅读我的文章的人没有多少益处。我的文章中的“你”和“我们”几乎总是指我自己,我所有的文章几乎都是写给我自己(未来的自己)看的。我希望世界上有更多过着不同生活方式的人,也希望不一样的想法越多越好,不盲从,敢批判,会发现,能创新,大抵是所有人应该追求的学习方法。

原创作者 » 陈帅华
版权声明 » 自由转载-保持署名-非商用-非衍生
发布日期 » 2019年6月24日 周一
更新日期 » 2020年8月4日 周二
上一篇 » Cordova入门教程
下一篇 » 我给自己理发
:)记录此刻想法
请选择登录方式,开始记录你的想法。
授权微博登录
授权Github登录