构建坚如磐石的 Ionic 应用程序的高级工作流程。第 1 部分：Playground
序幕
在M-Way Solutions，我们过去两年一直在使用Ionic构建大型企业级应用程序。我们面临的挑战促使我们创建了Generator-M-Ionic，这是一套功能强大的开源开发工具，与Ionic CLI一起，让您轻松掌握我们丰富的经验。
您是否正在寻找一种单一工具，可用于快速创建引人注目的原型以打动您的客户，并且以后可以根据测试、质量保证和持续集成等复杂的项目要求进行扩展？ 那么不要再犹豫了，准备好通过我们的生成器的“使用 Ionic 构建应用程序”冒险岛进行惊心动魄的旅程吧！
介绍
第一站是 Ionic 之前移动应用程序开发的古代遗址：早在 Ionic 与 Angular 一起进入我们的开发堆栈之前，我们就已经开始开发移动应用程序了。多年来，我们一直在探索 MV* 框架和移动框架的不同组合，我们甚至开发了自己的移动框架很长一段时间，但 Angular 和 Ionic一直给我们留下深刻的印象。专注于 Angular 和 Ionic 使我们能够应对应用程序开发、我们的业务和企业客户带来的许多其他挑战。
这些挑战促成了Generator-M-Ionic的诞生，并将我们直接带入了 Ionic 移动开发乐趣世界。该生成器现在对我们的开发流程和公司文化做出了宝贵贡献，并解决了移动应用开发的以下方面：
- 提供有用的工作流程
- 用于开发、测试、质量保证、构建、持续集成
- 满足复杂的项目需求，例如管理不同集和版本的 API、应用程序图标和启动画面
- 完美融入生态系统
- 标准化项目设置
因此，在使用Ionic进行移动应用程序开发时，它现在成为我们和不断壮大的社区的首选起点。您今天就可以开始使用它！无论您是为客户制作概念验证还是为演示制作原型，无论您为哪些平台或设备开发，该项目都能够无缝过渡到功能强大的成熟企业应用程序。
关于本系列
这篇文章是使用 Ionic 和 Generator-M-Ionic 开始开发的系列文章的一部分，因此事不宜迟，下面是我们的三幕冒险的有趣地图：
- 本部分的剩余部分：在我们岛上的幼儿游乐场上，用 Generator-M-Ionic 迈出第一步
- 准备工作
- 生成你的第一个应用程序
- 了解文件结构和 git 集成
- 第 2 部分：攀登严肃应用开发的顶峰
- 质量保证和测试
- 添加 Angular 组件、Sass、Cordova 插件和 bower 包
- 使用 livereload 在浏览器和设备上运行你的应用
- 使用Ionic CLI集成到Ionic 平台等不同的生态系统中
- 第 3 部分：让你的应用进入冒险轨道
- 通过环境和 CORS 代理轻松解决后端问题
- 了解强大的构建工具，如资源集和构建变量
- 有关持续集成和交付应用程序的一些技巧
- 展望未来，看看未来可能会有什么样的宝藏
所以，带上你的铲子、水桶和其他建筑设备，来操场上与我会面，设置你的第一个应用程序！
弄脏你的手
npm install --global generator-m-ionic bower yo gulp
这将使用节点包管理器以及流行的 Web 开发工具Bower（管理和安装客户端包，如 Angular）、Yeoman（运行生成器并构建您的应用）和Gulp（运行所有安装后任务）安装 Generator-M-Ionic。如果您不知道这些是什么，那么“包装盒内有什么”指南可以帮助您了解 Generator-M-Ionic 使用的技术。
创建项目
完成所有这些操作后，您可能需要创建一个新文件夹来生成项目并启动生成器：
# create new directory and change into it
mkdir adventure-island && cd $_
# launch generator
yo m-ionic
你会被问到一系列有关你正在创建的项目的问题，例如：
如果您不确定其中一些是什么意思，请参阅问题介绍文档中的解释。对于本系列的其余部分，我将使用选项卡作为入门模板。当您回答完所有问题后，将为您的项目安装所有节点和 bower 依赖项。这可能需要一段时间，但幸运的是，您只需为每个项目执行一次此操作。
一切完成后运行：
gulp watch
您的默认浏览器将自动打开。如果您不想这样，添加--no-open标志将阻止打开浏览器或新窗口。现在激活您的开发人员工具（在 OS X 上的 Chrome 中按cmd+alt+i）将让您看到如下所示的应用程序。
恭喜您已经构建了第一个应用程序！现在看起来可能没什么，但生成器已经为您完成了很多工作。让我们仔细看看：
文件结构
您的项目文件夹现在包含许多为您生成的文件。为了给您提供初步的总体了解，这些文件中最重要的是：
Cordova 相关文件和文件夹
config.xml # configuration of your Cordova project
platforms/ # platforms you installed
plugins/ # plugins you installed
www/ # will contain the build of your web app, before Cordova is added
Gulp 任务和依赖项
bower.json # dependencies like Angular & Ionic installed to app/bower_components/
gulpfile.js # configuration of all the Gulp tasks
gulp/ # more Gulp tasks
package.json # dependencies like Gulp plugins installed to node_modules/
应用程序文件
app/
└── index.html # single most important file, everything is 免责声明：本内容来源于第三方作者授权、网友推荐或互联网整理，旨在为广大用户提供学习与参考之用。所有文本和图片版权归原创网站或作者本人所有，其观点并不代表本站立场。如有任何版权侵犯或转载不当之情况，请与我们取得联系，我们将尽快进行相关处理与修改。感谢您的理解与支持！
请先 登录后发表评论 ~