Ionic,如何在 Ubuntu 20.04 上安装这个框架

关于离子

在下一篇文章中,我们将了解 Ionic 框架,以及如何在 Ubuntu 20.04 上安装它。 该框架将允许用户使用其他框架(例如 Angular)来实现项目. Ionic 是由 Drifty Co. 的 Max Lynch、Ben Sperry 和 Adam Bradley 于 2013 年创建的用于混合移动应用程序开发的完整开源 SDK。原始版本于 2013 年发布,构建于 AngularJS 和 Apache Cordova 之上。 然而,最新版本被重新构建为一组 Web 组件,其中 允许用户选择做 Angular、React 或 Vue.js 项目. 它还允许在没有任何用户界面框架的情况下使用 Ionic 组件。

离子的 提供工具和服务来开发基于现代 Web 开发实践和技术的混合桌面、移动和渐进式 Web 应用程序. 为此,可以使用 CSS、HTML5 和 Sass 等 Web 技术。 使用这个框架,我们可以开发具有与 iOS、Android 或 Web 本身兼容的 Web 技术的应用程序。 它还提供了一个强大的 CLI 工具,我们将能够使用它来管理和创建项目。

Ionic 的一般特性

  • 这个框架是免费和开源的. 它提供了一个移动优化的用户界面工具和组件库,用于创建快速和高度交互的应用程序。
  • Ionic 使用 Cordova, 以及最近用于访问主机操作系统功能(如 GPS、相机、手电筒等)的插件。
  • 用户可以构建他们的应用程序,然后为 Android、iOS、Windows、桌面(使用 Electron)或现代浏览器定制它们.
  • 离子的 包括活动部件、排版或可扩展的基本主题.
  • 使用时 Web组件, Ionic 提供了自定义组件和方法来与之交互。 其中一个组件,虚拟滚动,允许用户滚动浏览数千个项目的列表,而不会对性能产生任何影响。 另一个组件 Tabs 创建了一个选项卡式界面,支持本机风格的导航和历史状态管理。
  • 除了SDK,Ionic还提供 开发人员可用于启用功能的服务例如代码实现或自动构建。
  • 提供自己的 IDE,称为 Ionic Studio.
  • 它还提供了一个界面 命令行 (CLI) 创建项目. CLI 还允许开发人员添加额外的 Cordova 插件和包、启用推送通知、生成应用程序图标、启动画面和创建本机二进制文件。

在 Ubuntu 20.04 上安装 Ionic

这个框架的安装非常简单。 首先,我们只需要打开一个终端(Ctrl + Alt + T)和 更新我们的系统包:

sudo apt update; sudo apt upgrade

然后我们会 安装一些必要的包. 在同一个终端中,我们将不得不使用以下命令:

安装依赖

sudo apt install curl gnupg2 wget git

下一步将是 安装NodeJS. 这个例子我已经用版本测试过 14.x. 要安装此版本, 我们将首先添加必要的存储库:

添加回购节点

curl -sL https://deb.nodesource.com/setup_14.x | sudo bash -

那我们可以 安装 的NodeJS 运行另一个命令:

安装 nodejs

sudo apt install nodejs

Ionic 需要 Apache Cordova. 应该澄清的是,这是一组设备 API,允许移动应用程序开发人员使用 JavaScript 访问设备的本机功能,例如相机或加速度计。

安装NodeJS后,我们可以 安装科尔多瓦 运行:

科尔多瓦安装

sudo npm install -g cordova

此时,我们可以继续 使用 npm 安装 Ionic:

使用 npm 安装

sudo npm i -g @ionic/cli

安装完成后,我们可以 使用命令检查已安装的版本:

离子版

ionic -v

一个示例应用程序

要知道安装是否正确完成,我们可以从创建一个小示例应用程序开始。 为此,我们只需要 运行以下命令创建示例:

ionic start

运行此命令时 您必须定义要创建的项目类型. 对于这个例子,我选择了 Angular。 此外,您必须为您的项目命名并选择模板。 所有这些您都必须从类似于以下的屏幕中进行选择:

离子启动

设置好后, 将使用我们为项目提供的名称生成一个文件夹。 访问此文件夹以查看项目结构.

示例的启动说明

查看项目, 在同一个终端中,我们将执行另一个命令:

启动服务器

ionic serve --host 0.0.0.0 --port 8000

使用此命令 我们将允许任何主机访问端口 8000.

当你需要的一切都加载完毕时, 打开您的网络浏览器并转到 http://localhost:8000 o http://IP-de-tu-servidor:8000 您将看到刚刚创建的示例页面.

应用实例

Ionic 是一个现代框架,它允许我们以简单而优雅的方式开发跨平台应用程序。 可以获得 有关其安装和操作的更多信息和文档 项目网站.


成为第一个发表评论

发表您的评论

您的电子邮件地址将不会被发表。 必填字段标有 *

*

*

  1. 负责数据:MiguelÁngelGatón
  2. 数据用途:控制垃圾邮件,注释管理。
  3. 合法性:您的同意
  4. 数据通讯:除非有法律义务,否则不会将数据传达给第三方。
  5. 数据存储:Occentus Networks(EU)托管的数据库
  6. 权利:您可以随时限制,恢复和删除您的信息。