### Install Project Dependencies and Build Examples

Source: https://github.com/tencent/hippy/blob/main/docs/development/demo.md

Installs project dependencies and builds the Hippy JavaScript SDK packages. This includes installing project scripts, bootstrapping Lerna packages, and building SDKs. It also shows how to build a specific example like 'hippy-react-demo'.

```shell
# 在Hippy**根目录**执行命令
npm install

# 以hippy-react-demo为例说明编译流程
cd driver/js/
npm run init

# 该命令由 `npm install && npx lerna bootstrap && npm run build` 组成，你也可以分别执行这几个命令。
#
# npm install: 安装项目所需的脚本依赖。
#
# `npx lerna bootstrap`: 安装每一个 JS 包的依赖。（Hippy 使用 [Lerna](https://lerna.js.org/) 管理多个 js 包）
#
# `npm run build`: 构建每一个 JS SDK 包。

# 编译hippy-react-demo
npm run buildexample hippy-react-demo

# 如果上一条命令有异常，可以执行以下命令
cd examples/hippy-react-demo
npm install --legacy-peer-deps
cd ../..
npm run buildexample hippy-react-demo
```

--------------------------------

### Example Podfile for V8 Engine (Text)

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

This shows an example of how your Podfile should look after specifying the V8 engine for the JavaScript engine.

```text
#use_frameworks!
platform :ios, '11.0'
ENV['js_engine'] = 'v8' #切换为V8引擎

# TargetName大概率是您的项目名称
target TargetName do

    pod 'hippy', 'your_specified_version'

end

```

--------------------------------

### Start Hippy Web Renderer with Custom Modules and Components

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

Shows how to create a WebEngine instance with custom modules and components, and then start the Web Renderer with specific configuration.

```javascript
// 创建 web engine，如果有业务自定义模块和组件，从此处传入
// 如果只使用官方模块和组件，则直接使用 const engine = HippyWebEngine.create() 即可
const engine = HippyWebEngine.create({
  modules: {
    CustomCommonModule,
  },
  components: {
    CustomPageView,
  },
});

// 启动 web renderer
engine.start({
  // 挂载的 dom id
  id: 'root',
  // 模块名
  name: 'module-name',
  // 模块启动参数，业务自定义,
  // hippy-react 可以从 入口文件props里获取，hippy-vue可以从 app.$options.$superProps 里获取
  params: {
    path: '/home',
    singleModule: true,
    isSingleMode: true,
    business: '',
    data: { },
  },
});
```

--------------------------------

### Hippy Web Renderer Dynamic Bundle Loading

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

JavaScript code example for dynamically loading a Hippy business bundle using the Web Renderer engine.

```javascript
import { HippyWebEngine } from '@hippy/web-renderer';

const engine = HippyWebEngine.create();

 engine.load('https://xxxx.com/hippy-bundle/index.bundle.js').then(() => {
  engine.start({
    id: 'root',
    name: 'example',
  });
});
```

--------------------------------

### Compile and Run iOS Demo

Source: https://github.com/tencent/hippy/blob/main/docs/development/demo.md

Steps to compile and run the iOS demo. This involves navigating to the demo directory, installing dependencies using CocoaPods, and opening the Xcode workspace.

```shell
# 进入Hippy源码目录
cd ./framework/examples/ios-demo
# 使用 Cocoapods 生成工程
pod install
# 打开 workspace，编译运行即可
open HippyDemo.xcworkspace
```

--------------------------------

### hippy-vue-router Development Setup

Source: https://github.com/tencent/hippy/blob/main/driver/js/packages/hippy-vue-router/README.md

Commands for setting up the development environment for hippy-vue-router, including installing dependencies, building files, serving examples, and running tests.

```bash
# install deps
npm install

# build dist files
npm run build

# serve examples at localhost:8080
npm run dev

# lint & run all tests
npm test

# serve docs at localhost:8080
npm run docs
```

--------------------------------

### Hippy Web Renderer NPM Scripts

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

Configuration for npm scripts to manage the Web Renderer for Hippy projects. Includes commands for starting the development server and building the project.

```json
  "scripts": {
    "web:dev": "npm run hippy:dev & node ./scripts/env-polyfill.js webpack serve --config ./scripts/hippy-webpack.web-renderer.dev.js",
    "web:build": "node ./scripts/env-polyfill.js
webpack --config ./scripts/hippy-webpack.web-renderer.js"
  }
```

--------------------------------

### Hippy Web Renderer NPM Installation

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

Command to install the Hippy Web Renderer package using npm.

```shell
npm install -S @hippy/web-renderer
```

--------------------------------

### Switch to Yoga Layout Engine (Ruby)

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

To use the Yoga layout engine, specify 'Yoga' for the layout_engine in your Podfile. After modifying the Podfile, re-execute the 'pod install' command to update project dependencies.

```ruby
ENV['layout_engine'] = 'Yoga'
```

--------------------------------

### Initialize Hippy with Separate Package Loading (Objective-C)

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

This method is suitable for scenarios where you need to prepare the JS environment and load package 1 before the business starts, and then load package 2 when the business starts to reduce loading time. Package 1 is recommended as a base package, independent of the business, containing only common basic components usable by all businesses. Package 2 loads the business code.

```objectivec
/** 此方法适用于以下场景：
 * 在业务还未启动时先准备好JS环境，并加载包1，当业务启动时加载包2，减少包加载时间
 * 我们建议包1作为基础包，与业务无关，只包含一些通用基础组件，所有业务通用
 * 包2作为业务代码加载
*/

// 先加载包1，创建出一个HippyBridge实例
// 假设commonBundlePath为包1的路径
// Tips：详细参数说明请查阅头文件: HippyBridge.h
NSURL *commonBundlePath = getCommonBundlePath();
HippyBridge *bridge = [[HippyBridge alloc] initWithDelegate:self
                                                  bundleURL:commonBundlePath
                                             moduleProvider:nil
                                              launchOptions:your_launchOptions
                                                executorKey:nil];

// 再通过上述bridge以及包2地址创建HippyRootView实例
// 假设businessBundlePath为包2的路径
// Tips：详细参数说明请查阅头文件: HippyRootView.h
HippyRootView *rootView = [[HippyRootView alloc] initWithBridge:bridge
                                                    businessURL:businessBundlePath
                                                     moduleName:@"Your_Hippy_App_Name"
                                              initialProperties:@{}
                                                   shareOptions:nil
                                                       delegate:nil];

// 最后，给生成的rootView设置好frame，并将其挂载到指定的VC上。
rootView.frame = self.view.bounds;
rootView.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
[self.view addSubview:rootView];

// 至此，您已经完成一个Hippy应用的初始化，SDK内部将自动加载资源并开始运行Hippy应用。

```

--------------------------------

### iOS CocoaPods Install Command

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

Installs the dependencies specified in the Podfile, including the Hippy SDK, for an iOS project.

```Shell
pod install
```

--------------------------------

### Import Business Bundle and Initialize WebEngine

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

Demonstrates importing the main business bundle after the Web Renderer and initializing the Hippy WebEngine.

```javascript
import { HippyCallBack, HippyWebEngine, HippyWebModule, View } from '@hippy/web-renderer';
// 导入业务 bundle 的入口文件，需放在 web renderer 导入之后
import './main';


const engine = HippyWebEngine.create();
```

--------------------------------

### Switch to V8 JavaScript Engine (Ruby)

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

To use the V8 engine, add the following environment variable to your Podfile. After modifying the Podfile, re-execute the 'pod install' command to update project dependencies.

```ruby
ENV['js_engine'] = 'v8'
```

--------------------------------

### Hippy Web Renderer Bundle Loading (HTML)

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

HTML snippet demonstrating how to load the Hippy Web Renderer and business bundles via script tags.

```html
<script src="//xxx.com/lib/hippy-web-renderer/0.1.1/hippy-web-renderer.js"></script>
<!-- Business bundle -->
<script src="//xxx.com/hippy-biz/index.bundle.js"></script>
<!-- Entry file -->
<script src="src/index.ts"></script>
```

--------------------------------

### Hippy Web Renderer CDN Usage

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

Example HTML structure for using the Hippy Web Renderer via a CDN. This includes the necessary script tags for the Web Renderer and the application's bundle.

```html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <title>Example</title>
  </head>
  <body>
    <div id="root"></div>
    <!-- web renderer cdn url -->
    <!-- Hippy does not provide CDN resource management, businesses need to upload themselves -->
    <script src="//xxx.com/lib/hippy-web-renderer/0.1.1/hippy-web-renderer.js"></script>
    <script src="src/index.ts"></script>
  </body>
</html>
```

--------------------------------

### Install Development Dependencies (macOS)

Source: https://github.com/tencent/hippy/blob/main/docs/development/demo.md

Installs essential development tools like git, git-lfs, Node.js (v16), and npm (v7) on macOS using the Homebrew package manager.

```shell
brew install git git-lfs node@16 cmake
```

--------------------------------

### Start a Hippy React Project

Source: https://github.com/tencent/hippy/blob/main/docs/api/hippy-react/feedback.md

Instructions on how to start a new Hippy React project, referencing official documentation and demo examples.

```Markdown
# Hippy-React Common Feedback

## 1. How to start a hippy react project

Can refer to our documentation and demo first

https://hippyjs.org/#/hippy-react/introduction

https://github.com/Tencent/Hippy/tree/master/examples/hippy-react-demo
```

--------------------------------

### Hippy Web Renderer Initialization (NPM)

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

JavaScript code for initializing the Hippy Web Renderer and loading business bundles when using the NPM package.

```javascript
// 1. Import web renderer
import { HippyWebEngine, HippyWebModule } from '@hippy/web-renderer';

// 2. Import the entry file of the business bundle, which needs to be placed after importing the web renderer

// 3. Create web engine, pass custom modules and components from here if any
```

--------------------------------

### Custom ImageLoader Implementation

Source: https://github.com/tencent/hippy/blob/main/docs/api/performance.md

Provides an example of implementing a custom `ImageLoader` in Java for Hippy, which can be used for custom caching logic or integrating with third-party image loading libraries.

```java
HippyEngine.EngineInitParams initParams = new HippyEngine.EngineInitParams();
// 必须：宿主（Hippy的使用者）的Context
// 若存在多个Activity加载多个业务jsbundle的情况，则这里初始化引擎时建议使用Application的Context
initParams.context = this;
... 
// 必须：图片加载器
initParams.imageLoader = new MyImageLoader(this.getApplicationContext());
```

--------------------------------

### Project Initialization Commands

Source: https://github.com/tencent/hippy/blob/main/docs/development/debug.md

Commands to initialize a Hippy project, including cloning the repository, installing dependencies, and building the SDK and examples.

```Shell
git clone https://github.com/Tencent/Hippy.git
npm install
npx lerna bootstrap
npm run build
npm run buildexample [hippy-react-demo|hippy-vue-demo]
```

--------------------------------

### Clone Hippy Repository

Source: https://github.com/tencent/hippy/blob/main/docs/development/demo.md

Clones the Hippy project repository from GitHub to your local machine.

```shell
git clone  https://github.com/Tencent/Hippy.git
```

--------------------------------

### Install Flutter Dependencies

Source: https://github.com/tencent/hippy/blob/main/docs/development/voltron-flutter-integration-guidelines.md

Command to install project dependencies after modifying pubspec.yaml.

```shell
flutter pub get
```

--------------------------------

### Install Dependencies (iOS)

Source: https://github.com/tencent/hippy/blob/main/docs/development/use-hermes-engine.md

Command to install the necessary dependencies after modifying the Podfile for Hermes integration.

```Bash
pod install
```

--------------------------------

### Registering Turbo Modules and Methods

Source: https://github.com/tencent/hippy/blob/main/docs/api/performance.md

Shows how to register a Turbo module and its interaction functions using HIPPY_EXPORT_TURBO_MODULE and HIPPY_EXPORT_TURBO_METHOD macros in Objective-C.

```objective-c
@implementation TurboConfig

... 

// 注册模块
HIPPY_EXPORT_TURBO_MODULE(TurboConfig)

// 注册交互函数
HIPPY_EXPORT_TURBO_METHOD(getInfo) {
    return self.strInfo;
}
HIPPY_EXPORT_TURBO_METHOD(setInfo:(NSString *)string) {
    self.strInfo = string;
    return @(YES);
}

... 
@end
```

--------------------------------

### iOS Podfile Configuration for Hippy

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

Configures the Podfile for an iOS project to integrate the Hippy SDK. It specifies the Hippy version and includes necessary configurations for framework integration.

```Text
#use_frameworks!
platform :ios, '11.0'

target TargetName do

    # 在此指定步骤1中记录的hippy版本号，可访问 https://github.com/Tencent/Hippy/releases 查询更多版本信息
    pod 'hippy', '3.2.0'

end

# 工程开启 use_frameworks! 后需添加此环境变量，用于hippy使用正确设置项
ENV["use_frameworks"] = "true"
```

--------------------------------

### Initialize Engine with Turbo Enabled (Android)

Source: https://github.com/tencent/hippy/blob/main/docs/api/performance.md

Demonstrates how to initialize the Hippy engine on Android with the Turbo feature enabled. It also shows the definition of a native module for Turbo.

```java
HippyEngine.EngineInitParams initParams = new HippyEngine.EngineInitParams();
// 必须：宿主（Hippy的使用者）的Context
// 若存在多个Activity加载多个业务jsbundle的情况，则这里初始化引擎时建议使用Application的Context
initParams.context = this;
... 
// 必须：图片加载器
initParams.imageLoader = new MyImageLoader(this.getApplicationContext());
```

```java
// 初始化引擎开启 enableTurbo
val initParams = HippyEngine.EngineInitParams()
initParams.enableTurbo = true

// 定义 module
@HippyNativeModule(name = "demoTurbo")
class DemoTurboModule(context: HippyEngineContext?) : HippyNativeModuleBase(context) {
    ... 
    @HippyMethod(isSync = true)
    fun getNum(num: Double): Double = num
    ...
}
```

--------------------------------

### Dynamically Load Business Bundle

Source: https://github.com/tencent/hippy/blob/main/docs/development/web-integration-guidelines.md

Example of dynamically loading the Hippy business bundle using the Web Renderer engine and then starting the application.

```javascript
import { HippyWebEngine } from '@hippy/web-renderer';

const engine = HippyWebEngine.create();

 engine.load('https://xxxx.com/hippy-bundle/index.bundle.js').then(() => {
  engine.start({
    id: 'root',
    name: 'example',
  });
});
```

--------------------------------

### Dynamic Bundle Loading with HippyDynamicImportPlugin

Source: https://github.com/tencent/hippy/blob/main/docs/api/performance.md

Configures the webpack build process to enable dynamic loading of JavaScript bundles using the HippyDynamicImportPlugin.

```javascript
const HippyDynamicImportPlugin = require('@hippy/hippy-dynamic-import-plugin');

module.exports = {
  ... 
  plugins: [
    new HippyDynamicImportPlugin(),
  ],
};
```

--------------------------------

### iOS CMake Installation

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

Installs CMake, a cross-platform build system generator, using Homebrew. This is a prerequisite for Hippy integration on iOS.

```Shell
brew install cmake
```

--------------------------------

### iOS CocoaPods Installation

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

Installs CocoaPods, a dependency manager for iOS projects, using Homebrew. This is a prerequisite for integrating the Hippy SDK into an iOS project.

```Shell
brew install cocoapods
```

--------------------------------

### Hippy Vue Next SSR Production Setup

Source: https://github.com/tencent/hippy/blob/main/driver/js/examples/hippy-vue-next-ssr-demo/README.md

Instructions for building and running the @hippy/vue-next SSR demo in a production environment. This includes building all necessary bundles and starting the production web server.

```bash
npm run ssr:prod-build
npm run ssr:prod-server
```

--------------------------------

### Hippy Preloading Optimization

Source: https://github.com/tencent/hippy/blob/main/docs/api/performance.md

Preloading optimizes the first screen loading time by executing HippyBridge initialization early. This guide provides code examples for iOS and Android.

```JavaScript
HippyBridge *bridge = [[HippyBridge alloc] initWithDelegate:nil bundleURL:url moduleProvider:^NSArray<id<HippyBridgeModule>> * {
        return nil; // 或返回希望替换的module实例
} launchOptions:option executorKey:nil];

// 将bridge保存起来
```

```Java
mHippyEngine.initEngine(new HippyEngine.EngineListener() {
    @Override
    public void onInitialized(EngineInitStatus statusCode, String msg) {
        if (statusCode == EngineInitStatus.STATUS_OK) {
            HippyBundleLoader loader = ...;
            // e.g.:
            // new HippyAssetBundleLoader(context, assetName, true, "demo");
            // new HippyFileBundleLoader(filePath, true, "demo");
            mHippyEngine.preloadModule(loader);
        }
    }
})
```

--------------------------------

### Hippy Vue Next SSR Development Setup

Source: https://github.com/tencent/hippy/blob/main/driver/js/examples/hippy-vue-next-ssr-demo/README.md

Instructions for setting up and running the @hippy/vue-next SSR demo in development mode. This involves building client and server bundles and starting the development server.

```bash
npm run ssr:dev-client
npm run ssr:dev-server
```

--------------------------------

### Initialize and Build Hippy Demos (JS)

Source: https://github.com/tencent/hippy/blob/main/README.md

Commands to initialize the Hippy JavaScript environment and build example applications. This includes installing project dependencies, bootstrapping Lerna packages, and building front-end SDK packages.

```bash
cd driver/js/
npm run init
# npm install && npx lerna bootstrap && npm run build

npm run buildexample [hippy-react-demo|hippy-vue-demo|hippy-vue-next-demo]
```

--------------------------------

### Start Web Renderer with Custom Modules and Components

Source: https://github.com/tencent/hippy/blob/main/docs/development/web-integration-guidelines.md

Demonstrates how to create and start the Web Renderer engine, optionally providing custom modules and components, and configuring startup parameters.

```javascript
// 创建 web engine，如果有业务自定义模块和组件，从此处传入
// 如果只使用官方模块和组件，则直接使用 const engine = HippyWebEngine.create() 即可
const engine = HippyWebEngine.create({
  modules: {
    CustomCommonModule,
  },
  components: {
    CustomPageView,
  },
});

// 启动 web renderer
engine.start({
  // 挂载的 dom id
  id: 'root',
  // 模块名
  name: 'module-name',
  // 模块启动参数，业务自定义,
  // hippy-react 可以从 入口文件props里获取，hippy-vue可以从 app.$options.$superProps 里获取
  params: {
    path: '/home',
    singleModule: true,
    isSingleMode: true,
    business: '',
    data: { },
  },
});
```

--------------------------------

### Hippy Module Loading with AppContext (Android)

Source: https://github.com/tencent/hippy/blob/main/docs/api/performance.md

Loads a Hippy module on Android, ensuring that the ModuleLoadParams.context is set to AppContext for proper initialization. This is part of the pre-rendering or SSR setup.

```java
HippyEngine.ModuleLoadParams loadParams = new HippyEngine.ModuleLoadParams();
loadParams.context = getApplicationContext();
... 
mHippyView = mHippyEngine.loadModule(loadParams, listener, null);
```

--------------------------------

### Initialize Hippy Engine and Load Module (TypeScript)

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

This snippet shows how to create a HippyEngine instance, initialize it, and then load a business bundle. It's crucial to call loadModule after initEngine returns successfully.

```TypeScript
import libHippy from 'libhippy.so' // libhippy.so下面可能会有红线提示，可忽略
AppStorage.setOrCreate("libHippy", libHippy)
AppStorage.setOrCreate("abilityContext", this.context)
```

```TypeScript
this.hippyEngine = createHippyEngine(params)
this.hippyEngine.initEngine()
this.hippyEngine?.loadModule()
```

```TypeScript
HippyRoot({
    hippyEngine: this.hippyEngine,
    rootViewWrapper: this.rootViewWrapper,
    onRenderException: (exception: HippyException) => {
      this.exception = `${exception.message}\n${exception.stack}`
    },
})
```

--------------------------------

### Hippy Vue Next Demo Project Initialization

Source: https://github.com/tencent/hippy/blob/main/driver/js/examples/hippy-vue-next-ssr-demo/README.md

Commands to initialize the @hippy/vue-next demo project, including installing dependencies and building front-end SDK packages.

```bash
npm run init
cd examples/hippy-vue-next-ssr-demo
npm install --legacy-peer-deps
```

--------------------------------

### Compiling JavaScript to Hermes Bytecode (HBC)

Source: https://github.com/tencent/hippy/blob/main/docs/development/use-hermes-engine.md

A JavaScript code example demonstrating how to use the installed Hermes compiler (`@hippy/hermesc`) to convert JavaScript files into Hermes bytecode (HBC) format. It includes logic to find the correct `hermesc` executable based on the operating system.

```javascript
// 1. 获取 Hermes compiler 路径
const getHippyHermescPath = () => {
    // 请确保在执行此代码之前，已经安装了 Hermes compiler，并且 hermesc 路径正确
    const hermesPath = path.resolve(__dirname, '../node_modules/@hippy/hermesc');
    console.log('hermes package path:', hermesPath);
    let hermesc = `${hermesPath}/%OS%-bin/hermesc`;
    switch (process.platform) {
        case 'win32':
        hermesc = hermesc.replace('%OS%', 'win64');
        break;
        case 'darwin':
        hermesc = hermesc.replace('%OS%', 'osx');
        break;
        default:
        hermesc.replace('%OS%', 'linux64');
        break;
    }
    console.log('hermesc path:', hermesc);
    return hermesc;
};

// 2. 调用Hermes compiler生成HBC文件
const { exec } = require('child_process');

const compileJSToHBC(inputJSPath, outputHBCPath) => {
    let hermesc = getHippyHermescPath();
    exec(`${hermesc} -emit-binary -O -g0 -out ${outputHBCPath} ${inputJSPath}`, (error, stdout, stderr) => {
        if (error) {
            console.error(`执行出错: ${error.message}`);
            return;
        }
        if (stderr) {
            console.error(`错误输出: ${stderr}`);
            return;
        }
        console.log(`成功生成 HBC 文件: ${stdout}`);
    });
};

// 调用示例：
compileJSToHBC('path/to/input.js', 'path/to/output.hbc');
```

--------------------------------

### Import and Initialize Web Renderer (NPM)

Source: https://github.com/tencent/hippy/blob/main/docs/development/web-integration-guidelines.md

Demonstrates how to import the necessary classes from the @hippy/web-renderer package and initialize the Web Engine in your entry file.

```javascript
// 1. 导入 web renderer
import { HippyWebEngine, HippyWebModule } from '@hippy/web-renderer';

// 2. 导入业务 bundle 的入口文件，需放在 web renderer 导入之后

// 3. 创建 web engine，如果有业务自定义模块和组件，从此处传入
```

--------------------------------

### CMakeLists.txt for Hippy Integration

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

This CMakeLists.txt file configures the build process for integrating Hippy C++ code. It sets up directories, adds the Hippy implementation as a subdirectory, and links it to the main project library.

```CMake
cmake_minimum_required(VERSION 3.14)
project(hippy)

set(BIZ_ROOT_DIR "${CMAKE_CURRENT_SOURCE_DIR}/../../../..//")
set(HIPPY_ROOT_DIR "${BIZ_ROOT_DIR}/Hippy_src/framework/ohos/")
set(HIPPY_IMPL_CPP_DIR "${HIPPY_ROOT_DIR}/src/main/cpp/impl")

add_subdirectory("${HIPPY_IMPL_CPP_DIR}" ./hippy_impl)

add_library(${PROJECT_NAME} SHARED

)

target_link_libraries(${PROJECT_NAME} PUBLIC hippy_impl)

set(SOURCE_SET
  )
set(PUBLIC_SOURCE_SET
  )
target_sources(${PROJECT_NAME} PRIVATE ${SOURCE_SET} PUBLIC ${PUBLIC_SOURCE_SET})
```

--------------------------------

### Install Cocoapods with Homebrew

Source: https://github.com/tencent/hippy/blob/main/docs/development/ios-3.0-integration-guidelines.md

Installs the Cocoapods dependency manager for iOS and macOS projects using Homebrew.

```Shell
brew install cocoapods
```

--------------------------------

### Install CMake with Homebrew

Source: https://github.com/tencent/hippy/blob/main/docs/development/ios-3.0-integration-guidelines.md

Installs the CMake build system using the Homebrew package manager on macOS.

```Shell
brew install cmake
```

--------------------------------

### Initialize Hippy Web Renderer

Source: https://github.com/tencent/hippy/blob/main/driver/js/packages/hippy-web-renderer/README.zh_CN.md

Demonstrates how to initialize and start the Hippy Web Renderer using hippy-react. This involves importing the Hippy class and configuring the application name and entry page.

```javascript
import { Hippy } from '@hippy/react';
import App from './app';

new Hippy({
  appName: 'Demo',
  entryPage: App,
  silent: false,
}).start();

```

--------------------------------

### Install Project Dependencies with Cocoapods

Source: https://github.com/tencent/hippy/blob/main/docs/development/ios-3.0-integration-guidelines.md

Installs or updates the project's dependencies as defined in the Podfile, including the Hippy SDK.

```Shell
pod install
```

--------------------------------

### Build and Run iOS Demo App

Source: https://github.com/tencent/hippy/blob/main/README.md

Instructions for building and running the Hippy iOS demo application. This involves installing CocoaPods and CMake, running 'pod install' to set up the workspace, and then building the app in Xcode.

```bash
cd framework/examples/ios-demo
pod install
# Open HippyDemo.xcworkspace in Xcode and build.
```

--------------------------------

### Configure External Native Options (JSON)

Source: https://github.com/tencent/hippy/blob/main/docs/development/native-integration.md

No description

```JSON
{
  "externalNativeOptions": {
    "path": "./src/main/cpp/CMakeLists.txt",
    "arguments": "",
    "cppFlags": "",
  },
}
```

--------------------------------

### Install Xcode Command Line Tools

Source: https://github.com/tencent/hippy/blob/main/docs/development/ios-3.0-integration-guidelines.md

Installs necessary command-line tools for Xcode, which might be required for compiling C++ modules used by the Hippy SDK.

```Shell
sudo xcode-select --install
sudo xcode-select --reset
```

--------------------------------

### Install Demo Dependencies

Source: https://github.com/tencent/hippy/blob/main/README.md

A troubleshooting step to install dependencies for specific Hippy demos if the initial initialization fails. This involves navigating to the demo's directory and running npm install.

```bash
cd driver/js/examples/[hippy-react-demo|hippy-vue-demo]
npm install
```

--------------------------------

### Installing Hippy Hermes Compiler

Source: https://github.com/tencent/hippy/blob/main/docs/development/use-hermes-engine.md

Command to install the Hermes compiler npm package for Hippy projects. This package provides the necessary tools to compile JavaScript code into Hermes bytecode (HBC).

```bash
npm install @hippy/hermesc --save-dev
```