第45章 无框架入门指南 · React Native

版本：0.77 不依赖框架的入门指南 平台支持：Android、iOS、macOS、TV、watchOS、Web、Windows、visionOS 如果现有框架无法满足你的特定约束条件，或者你更倾向于自行编写框架，就可以在不使用框架的情况下创建 React Native 应用。 首先，需要配置开发环境。环境就绪后，按照以下步骤创建应用并开始开发。 第一步：创建新应用 如果之前安装过全局的 react-native-cli 包，请卸载它，以免引发意外问题： npm uninstall -g react-native-cli @react-native-community/cli
你可以使用 React Native Community CLI 来生成新项目。这里创建一个名为“AwesomeProject”的新 React Native 项目： npx @react-native-community/cli@latest init AwesomeProject
如果你是在将 React Native 集成到现有应用中，或者项目中已安装 Expo，又或者是为现有 React Native 项目添加 Android 支持（参见“与现有应用的集成”），则无需执行此步骤。此外，也可以第三方 CLI 工具来搭建 React Native 应用，例如 Ignite CLI。 提示 如果 iOS 方面遇到问题，可以重新安装依赖项，运行以下命令： cd ios 进入 ios 目录。 bundle install 安装 Bundler bundle exec pod install 通过 CocoaPods 安装 iOS 依赖。 [可选] 使用特定版本或模板 如果希望以特定版本的 React Native 启动新项目，可以使用 --version 参数： npx @react-native-community/cli@X.XX.X init AwesomeProject --version X.XX.X
你也可以使用 --template 参数，以自定义 React Native 模板启动项目，详细请见此处。 第二步：启动 Metro Metro 是 React Native 的 JavaScript 构建工具。在项目目录下运行以下命令以启动 Metro 开发服务器： npmYarnnpm start
yarn start
注 如果你熟悉 Web 开发，Metro 类似于 Vite 和 webpack 等打包器，但它是专为 React Native 端到端设计的。例如，Metro 使用 Babel 将 JSX 等语法转换为可执行的 JavaScript。 第三步：启动应用 让 Metro Bundler 在单独的终端中运行。在 React Native 项目目录下打开新终端，运行以下命令： npmYarnnpm run android
yarn android
如果一切配置正确，稍后你应该能在 Android 模拟器中看到新应用运行起来。 这是运行应用的一种方式，你也可以直接在 Android Studio 里运行。 如果运行不成功，请查看故障排除页面。

Step 4: Modifying your app​

应用成功跑起来之后，我们再来改一改它。 用你喜欢的文本编辑器打开 App.tsx，修改几行代码，然后按两次 R 键，或在开发者菜单（Ctrl + M）中选择 Reload，即可看到改动效果！

That's it!​

恭喜！你已经成功运行并修改了第一个最简 React Native 应用。

Now what?​

如果想把新的 React Native 代码集成到现有应用中，请查看集成指南。如果想进一步了解 React Native，可以阅读 React Native 简介。