有什么自己做h5的app

现在移动技术越来越成熟,移动应用越来越普及,但是开发一款原生App需要花费大量的时间和经费。而H5技术(HTML、CSS、JavaScript)能简化开发难度和成本,可嵌入移动App中使用,成为许多App不可或缺的一部分。

下面介绍如何自己制作一个H5 App。

首先,我们需要准备的工具:文本编辑器、web服务器、Ionic、Cordova 和Git

一、项目结构

创建项目目录,下面的路径是为Ionic的结构:

```

myApp/

├── hooks/

├── platforms/

├── plugins/

├── www/

└── config.xml

```

二、初始化一个Ionic项目

在上面的目录下初始化Ionic项目,需要先安装Ionic的命令行工具,安装Node.js之后使用Node.js的包管理工具npm安装。

```

npm install -g ionic

```

创建项目

```

ionic start myApp kusohh

```

在初始的ionic项目中,www目录包含我们的应用程序代码,这里我们可以编写HTML、CSS、JavaScript文件。

ionic serve命令可以启动一个本地服务器,web应用运行在本地浏览器,可以方便的开发H5应用和移动应用的调试。

```

ionic serve

```

三、添加Cordova支持

Ionic提供了便捷的Cordova集成,Cordova是一个用于开发移动App的框架,允许你使用web技术开发,通过WebView在智能手机和平板电脑上运行你的应用程序。

使用Ionic的Cordova命令行工具可以方便地将Cordova设置成Ionic项目的一部分。先安装Cordova,然后在Ionic项目的根目录下使用以下命令:

```

ionic cordova platform add android // 添加Android平台

ionic cordova platform add ios // 添加iOS平台

```

通过以上命令可以在我们的项目中添加Android或iOS平台的支持。但是如果没有部署Android和iOS SDK,这些命令将失败。

```

npm install -g cordova

```

四、打包和发布应用程序

使用以下命令打出可安装的apk文件和ipa文件:

```

ionic cordova build --release android // android平台打包

ionic cordova build --release ios // ios平台打包

```

在这里,我们将签名应用程序,让应用程序能够在设备上安装。

签名应用程序用户名和密码

```

keytool -genkey -v -keystore myApp.keystore -alias myApp -keyalg RSA -keysize 2048 -validity 10000

```

使用jarsigner工具签名apk文件

```

jarsigner -verbose -sigalg SHA1withRSA -digestalg SHA1 -keystore myApp.keystore platforms\android\build\outputs\apk\android-release-unsigned.apk myApp

```

对签名后的Apk文件进行优化:

```

cordova build --release android -- --keystore=myApp.keystore --storePassword=password --alias=myApp --password=password

```

在以上步骤完成之后,多平台的应用已经可以发布和分享了。

以上就是建立一个H5 App的简单流程,其实,H5技术的应用范围并不止于此,我们可以学习更多的技术,使用到各种场合,H5技术在移动App开发异军突起。