快速上手

欢迎来到 Lynx 文档,我们将创建一个 Lynx 项目,并且将它运行起来。

系统要求

  • Node.js 18 或更新的版本
    • 当使用 TypeScript 作为配置文件时,需要使用 Node.js 18.19 或更新的版本

安装

创建一个 Lynx 项目

在 Lynx 项目中,我们使用 Rspeedy(一个基于 Rspack 的 Lynx 构建工具)来构建源码。

推荐通过 create-rspeedy 来快速创建一个 Lynx 项目,执行:

npm
yarn
pnpm
bun
npm create rspeedy@latest

跟随提示来创建一个 Lynx 项目。

准备 Lynx Explorer

Lynx Explorer 是一个可以快速试用 Lynx 的沙盒环境。

目前我们仅提供 iOS 模拟器的预编译二进制文件。如果你需要在真实 iOS 设备上运行 Lynx Explorer,则需要从源代码构建。请参考为 iOS 构建 Lynx Explorer 指南。

INFO

社区贡献者在 App Store 上提供了 Lynx Explorer 的版本。
虽然此版本未经 Lynx 团队审核和维护,但我们感谢社区让开发者能够更方便地在 iOS 上尝试 Lynx。

  1. 安装 Xcode

打开 Mac App Store,搜索 Xcode,点击安装(如果已安装则点击更新)。

  1. 下载 LynxExplorer

下载 LynxExplorer-arm64.app.tar.gz

然后,解压下载的压缩包:

mkdir -p LynxExplorer-arm64.app/
tar -zxf LynxExplorer-arm64.app.tar.gz -C LynxExplorer-arm64.app/
  1. 在模拟器上安装 LynxExplorer

打开 Xcode,从 Xcode 菜单中选择 Open Developer Tool。点击 Simulator 选项以启动一个模拟器,然后将 LynxExplorer-arm64.app 拖入模拟器中完成安装。

下载 LynxExplorer-x86_64.app.tar.gz

然后,解压下载的压缩包:

mkdir -p LynxExplorer-x86_64.app/
tar -zxf LynxExplorer-x86_64.app.tar.gz -C LynxExplorer-x86_64.app/
  1. 在模拟器上安装 LynxExplorer

打开 Xcode,从 Xcode 菜单中选择 Open Developer Tool。点击 Simulator 选项以启动一个模拟器,然后将 LynxExplorer-x86_64.app 拖入模拟器中完成安装。

扫描二维码从 GitHub Release 下载预编译应用。

或者,你可以按照为 Android 构建 Lynx Explorer 指南从源代码构建。

INFO

社区贡献者在 Play Store 上提供了 Lynx Explorer 的版本。
虽然此版本未经 Lynx 团队审核和维护,但我们感谢社区让开发者能够更方便地在 Android 上尝试 Lynx。

开始开发

  1. 进入 Lynx 项目:
cd <project-name>
  1. 安装依赖:
npm
yarn
pnpm
bun
npm install
  1. 启动开发服务器:
npm
yarn
pnpm
bun
npm run dev

您将看到终端中出现一个二维码,请使用您的Lynx Explorer应用扫描。如果您正在使用模拟器,只需复制捆绑URL并粘贴到Lynx Explorer应用中的"Enter Card URL"输入框中,然后点击"Go"。

  1. 进行第一次更改:

在代码编辑器中打开 src/App.tsx 文件并进行更改。

你应该会看到 Lynx Explorer 上的 UI 自动更新。


调试应用

访问 Lynx DevTool 下载并打开 Lynx DevTool 桌面应用,使用数据线连接正在运行 Lynx 的设备,开始调试应用。

访问调试工具,学习如何调试应用。

下一步

以下是我们建议接下来探索的一些内容,你可以按任意顺序阅读它们。

ReactLynx 框架

ReactLynx 是 Lynx 的官方 React 框架,学习如何用 React 的方式构建 Lynx 页面。

描绘界面

Lynx 能够让你用熟悉的 Web 技术来构建精美的用户界面, 学习如何在 Lynx 引擎中描绘界面。


集成

Lynx 能够被集成到已有的应用中,学习如何将 Lynx 集成到现有 iOS/Android/Web 应用中。

除非另有说明,本项目采用知识共享署名 4.0 国际许可协议进行许可,代码示例采用 Apache License 2.0 许可协议进行许可。