跨ios android框架,Hippy: Hippy 是一个新生的跨端开发框架，目标是使开发者可以只写一套代码就直接运行于三个平台（iOS、Android 和 Web）...
Hippy 跨端开发框架
介绍
Hippy 是一个新生的跨端开发框架，目标是使开发者可以只写一套代码就直接运行于三个平台(iOS、Android 和 Web)。Hippy 的设计是面向传统 Web 开发者的，特别是之前有过 React Native 和 Weex 开发经验的开发者用起来会更为顺手，Hippy 致力于让前端开发跨端 App 更加容易。
到目前为止，腾讯内已经有 27 款主流 App 在使用 Hippy 框架，包括手机QQ、手机QQ浏览器、腾讯视频App，QQ音乐App等，每日触达数亿用户。
特征
为传统 Web 前端设计，官方支持 React 和 Vue 两种主流前端框架。
不同的平台保持了相同的接口。
通过 JS 引擎 binding 模式实现的前终端通讯，具备超强性能。
提供了高性能的可复用列表。
皆可平滑迁移到 Web 浏览器。
完整支持 Flex 的布局引擎。
项目结构
Hippy
├── examples # 前终端范例代码。
│ ├── hippy-react-demo # hippy-react 前端范例代码。
│ ├── hippy-vue-demo # hippy-vue 前端范例代码。
│ ├── ios-demo # iOS 终端范例代码。
│ └── android-demo # Android 终端范例代码。
├── packages # 前端 npm 包。
│ ├── hippy-debug-server # Hippy 的前终端调试服务。
│ ├── hippy-react # Hippy 的 React 语法绑定。
│ ├── hippy-react-web # hippy-react 转 Web 的库。
│ ├── hippy-vue # Hippy 的 Vue 语法绑定。
│ ├── hippy-vue-css-loader # 用来将 CSS 文本转换为 JS 语法树以供解析的 Webpack loader。
│ ├── hippy-vue-native-components # hippy-vue 中浏览器中所没有的，额外的，终端定制组件。
│ ├── hippy-vue-router # 在 hippy-vue 中运行的 vue-router。
│ └── types # 全局 Typescript 类型
├── ios
│ └── sdk # iOS SDK。
├── android
│ ├── support_ui # Android 终端实现的组件。
│ └── sdk # Android SDK。
├── core # C++ 实现的 JS 模块，通过 Binding 方式运行在 JS 引擎中。
├── layout # Hippy 布局引擎。
├── scripts # 项目编译脚本。
开始
准备环境
macOS 用户需要以下软件：
Xcode 和 iOS SDK: 用以编译 iOS 终端 app。
Android Studio 和 NDK: 用以编译 Android app。
Node.JS: 用来运行前端编译脚本。
我们推荐使用 homebrew 来安装依赖。
Windows 用户需要以下软件:
Android Studio 和 NDK: 用以编译 Android app。
Node.JS: 用来运行前端编译脚本。
Windows 用户受条件所限，暂时无法进行 iOS app 开发
编译出你的 Hippy app
使用 hippy-react or hippy-vue 范例项目来启动 iOS 模拟器
我们推荐 iOS 开发者使用模拟器来进行开发和调试工作，当然如果你是一个 iOS 开发高手，也可以通过修改配置将 Hippy app 安装到手机上。
项目根目录运行命令 npm install 安装前端依赖。
项目根目录运行命令 lerna bootstrap 安装前端每一个 package 依赖。(Hippy 采用 Lerna 管理多JS仓库，如果出现 lerna command is not found, 先执行 npm install lerna -g)
项目根目录运行命令 npm run build 编译前端 SDK 包。
选择一个前端范例项目来进行编译，项目根目录运行 npm run buildexample -- [hippy-react-demo|hippy-vue-demo]。
启动 Xcode 并且开始编译终端 App：open examples/ios-demo/HippyDemo.xcodeproj。
cd 到 examples hippy-react-demo 或者 hippy-vue-demo 目录，先执行 npm install 安装 demo 的依赖包，再分别执行 npm run hippy:dev 和 npm run hippy:debug, 即开启实时 Debug 模式。
在 example 调试模式下，@hippy/react、@hippy/vue 等 npm 模块会直接链接到 packages > [different package] > dist 目录下面的js文件，所以如果你修改了 packages 下的源代码并且想让其在 example 中生效，请重新在根目录执行 npm run build。
启动 Android App 来测试 hippy-react 或者 hippy-vue 范例
我们推荐 Android 开发者使用真机，因为 Hippy 使用的 X5 JS 引擎没有提供 x86 的库以至于无法支持 x86 模拟器，但是使用 ARM 模拟器又很慢。
在开始前请确认好 SDK 和 NDK 都安装了范例的指定版本，并且请勿更新编译工具链。
项目根目录运行命令 npm install 安装前端依赖。
项目根目录运行命令 lerna bootstrap 安装前端每一个 package 依赖。(Hippy 采用 Lerna 管理多JS仓库，如果出现 lerna command is not found, 先执行 npm install lerna -g)
项目根目录运行命令 npm run build 编译前端 SDK 包。
选择一个前端范例项目来进行编译，项目根目录运行 npm run buildexample -- [hippy-react-demo|hippy-vue-demo]。
用 Android Studio 来打开终端范例工程 examples/android-demo。
用 USB 数据线插上你的 Android 手机，需要确认手机打开 USB 调试模式和 USB 安装。
运行工程，并安装 APK。
cd 到 examples hippy-react-demo 或者 hippy-vue-demo 目录，先执行 npm install 安装 demo 的依赖包，再分别执行 npm run hippy:dev 和 npm run hippy:debug, 即开启实时 Debug 模式。
在 example 调试模式下，@hippy/react、@hippy/vue 等 npm 模块会直接链接到 packages > [different package] > dist 目录下面的js文件，所以如果你修改了 packages 下的源代码并且想让其在 example 中生效，请重新在根目录执行 npm run build。
如果 Android Studio 报了这个错误 No toolchains found in the NDK toolchains folder for ABI with prefix: mips64el-linux-android，这里有解决办法。
贡献
欢迎开发人员为腾讯的开源做出贡献，我们将持续激励他们并感谢他们。我们提供了腾讯对开源贡献的说明，每个项目的具体贡献规则由项目团队制定。开发人员可以选择适当的项目并根据相应的规则参与。腾讯项目管理委员会将定期汇报合格的贡献者，奖项将由官方联络人颁发。
追星数
许可协议