# 安装

<div id="install"></div>

只需三个命令，即可从空文件夹创建并运行一个已配置好路由、网络、主题和代码生成的 Flutter 应用。

<div class="ny-doc-strip">
<span class="ny-doc-strip-label">开始之前</span>
<span class="ny-doc-strip-item">已安装 Flutter SDK</span>
<span class="ny-doc-strip-dot"></span>
<span class="ny-doc-strip-item">Dart 3</span>
<span class="ny-doc-strip-dot"></span>
<a href="/zh/docs/7.x/requirements">完整要求 →</a>
</div>

## 安装

请按顺序运行这些命令。每个命令都可以安全地重复运行。

<div class="ny-doc-steps">
<div class="ny-doc-step">
<span class="ny-doc-step-num">1</span>
<h3 class="ny-doc-step-title">全局安装 Nylo CLI</h3>

将 `nylo` 命令安装到您的系统中。

``` bash
dart pub global activate nylo_installer
```

</div>

<div class="ny-doc-step">
<span class="ny-doc-step-num">2</span>
<h3 class="ny-doc-step-title">创建新项目</h3>

此命令会克隆 Nylo 模板，使用您的应用名称配置项目，并自动安装所有依赖。

``` bash
nylo new my_app
```

</div>

<div class="ny-doc-step">
<span class="ny-doc-step-num">3</span>
<h3 class="ny-doc-step-title">设置 Metro 别名</h3>

这将为您的项目配置 `metro` 命令，让您无需完整的 `dart run` 语法即可使用 Metro CLI 命令。

``` bash
cd my_app
nylo init
```

之后请重启终端，或运行 `nylo init` 打印出的 `source` 命令。

</div>
</div>

<div class="ny-doc-panel">
<div class="ny-doc-panel-head">
<img src="https://nylo.dev/images/nylo_logo.png" alt="" class="ny-mark h-[16px]">
<span>您将获得</span>
</div>
<div class="ny-doc-panel-body">
<div class="ny-doc-panel-grid">
<div class="ny-doc-panel-item">预配置的路由和导航</div>
<div class="ny-doc-panel-item">API 服务模板</div>
<div class="ny-doc-panel-item">主题和本地化设置</div>
<div class="ny-doc-panel-item">用于代码生成的 Metro CLI</div>
</div>
</div>
</div>


<div id="running-the-project"></div>

## 运行项目

Nylo 项目像任何标准 Flutter 应用一样运行。

<div class="ny-doc-tabs" x-data="{ tab: '\u7ec8\u7aef' }">
<div class="ny-doc-tabbar" role="tablist">
<button type="button" role="tab" class="ny-doc-tab" @click="tab = '\u7ec8\u7aef'" :class="tab === '\u7ec8\u7aef' ? 'is-active' : ''" :aria-selected="tab === '\u7ec8\u7aef'">终端</button>
<button type="button" role="tab" class="ny-doc-tab" @click="tab = 'Android Studio'" :class="tab === 'Android Studio' ? 'is-active' : ''" :aria-selected="tab === 'Android Studio'">Android Studio</button>
<button type="button" role="tab" class="ny-doc-tab" @click="tab = 'VS Code'" :class="tab === 'VS Code' ? 'is-active' : ''" :aria-selected="tab === 'VS Code'">VS Code</button>
</div>

<div class="ny-doc-tabpanel" role="tabpanel" x-show="tab === '\u7ec8\u7aef'" x-cloak>

``` bash
flutter run
```

如果构建成功，应用将显示 Nylo 的默认着陆页。

</div>

<div class="ny-doc-tabpanel" role="tabpanel" x-show="tab === 'Android Studio'" x-cloak>

打开项目文件夹，在目标选择器中选择设备，然后按 **Run**。

<a href="https://docs.flutter.dev/tools/android-studio#running-and-debugging" target="_BLANK">Flutter 文档：运行和调试 ↗</a>

</div>

<div class="ny-doc-tabpanel" role="tabpanel" x-show="tab === 'VS Code'" x-cloak>

打开项目文件夹，然后从命令面板运行 **Debug: Start Without Debugging**。

<a href="https://docs.flutter.dev/tools/vs-code#run-app-without-breakpoints" target="_BLANK">Flutter 文档：无断点运行 ↗</a>

</div>

</div>


<div id="metro-cli"></div>

## Metro CLI

Metro 会为您生成项目文件。不带参数运行可查看菜单，也可以直接调用命令。

``` plaintext
$ metro

Metro - Nylo's Companion to Build Flutter apps by Anthony Gordon

Usage:
    command [options] [arguments]

Options
    -h

All commands:

[Widget Commands]
  make:page
  make:stateful_widget
  make:stateless_widget
  make:state_managed_widget
  make:navigation_hub
  make:journey_widget
  make:bottom_sheet_modal
  make:button
  make:form

[Helper Commands]
  make:model
  make:provider
  make:api_service
  make:controller
  make:event
  make:route_guard
  make:config
  make:interceptor
  make:command
  make:env
```

### 命令参考

每个命令都接收一个名称，例如 `metro make:page settings_page`

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">Widget 命令</div>
<div class="ny-doc-command">
<code>metro make:page</code>
<span>创建新页面</span>
</div>
<div class="ny-doc-command">
<code>metro make:stateful_widget</code>
<span>创建有状态组件</span>
</div>
<div class="ny-doc-command">
<code>metro make:stateless_widget</code>
<span>创建无状态组件</span>
</div>
<div class="ny-doc-command">
<code>metro make:state_managed_widget</code>
<span>创建状态管理组件</span>
</div>
<div class="ny-doc-command">
<code>metro make:navigation_hub</code>
<span>创建导航中心（底部导航）</span>
</div>
<div class="ny-doc-command">
<code>metro make:journey_widget</code>
<span>创建导航中心的旅程组件</span>
</div>
<div class="ny-doc-command">
<code>metro make:bottom_sheet_modal</code>
<span>创建底部弹窗</span>
</div>
<div class="ny-doc-command">
<code>metro make:button</code>
<span>创建自定义按钮组件</span>
</div>
<div class="ny-doc-command">
<code>metro make:form</code>
<span>创建带验证的表单</span>
</div>
</div>

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">辅助命令</div>
<div class="ny-doc-command">
<code>metro make:model</code>
<span>创建模型类</span>
</div>
<div class="ny-doc-command">
<code>metro make:provider</code>
<span>创建 provider</span>
</div>
<div class="ny-doc-command">
<code>metro make:api_service</code>
<span>创建 API 服务</span>
</div>
<div class="ny-doc-command">
<code>metro make:controller</code>
<span>创建控制器</span>
</div>
<div class="ny-doc-command">
<code>metro make:event</code>
<span>创建事件</span>
</div>
<div class="ny-doc-command">
<code>metro make:route_guard</code>
<span>创建路由守卫</span>
</div>
<div class="ny-doc-command">
<code>metro make:config</code>
<span>创建配置文件</span>
</div>
<div class="ny-doc-command">
<code>metro make:interceptor</code>
<span>创建网络拦截器</span>
</div>
<div class="ny-doc-command">
<code>metro make:command</code>
<span>创建自定义 Metro 命令</span>
</div>
<div class="ny-doc-command">
<code>metro make:env</code>
<span>从 .env 生成环境配置</span>
</div>
</div>

### 使用示例

``` bash
# Create a new page
metro make:page settings_page

# Create a model
metro make:model User

# Create an API service
metro make:api_service user_api_service
```


<div id="nylo-cli"></div>

## Nylo CLI

<!-- uncertain: strip label "Requires" — no established translation in this locale's existing files -->
<div class="ny-doc-strip">
<span class="ny-doc-strip-label">需要</span>
<span class="ny-doc-strip-item">nylo_installer 1.8.0+</span>
<span class="ny-doc-strip-dot"></span>
<a href="#nylo-self-update">更新 CLI →</a>
</div>

第 1 步中的 `nylo` 命令不仅仅用于创建项目。从项目目录运行它，还可以清理构建、刷新 iOS Pod、运行测试并检查您的翻译。

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">项目命令</div>
<div class="ny-doc-command">
<code>nylo new</code>
<span>创建新项目</span>
</div>
<div class="ny-doc-command">
<code>nylo init</code>
<span>在您的 shell 中设置 metro 别名</span>
</div>
<div class="ny-doc-command">
<code>nylo clean</code>
<span>运行 flutter clean 和 flutter pub get</span>
</div>
<div class="ny-doc-command">
<code>nylo ios:pod-refresh</code>
<span>重新安装您的 iOS Pod</span>
</div>
<div class="ny-doc-command">
<code>nylo metro</code>
<span>在不使用别名的情况下运行 Metro 命令</span>
</div>
</div>

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">测试与翻译</div>
<div class="ny-doc-command">
<code>nylo test</code>
<span>格式化并运行您的测试</span>
</div>
<div class="ny-doc-command">
<code>nylo locale:find-untranslated</code>
<span>查找未使用 .tr() 包装的文本</span>
</div>
<div class="ny-doc-command">
<code>nylo locale:check-missing-keys</code>
<span>查找语言文件中缺失的键</span>
</div>
</div>

<div class="ny-doc-commands">
<div class="ny-doc-commands-head">CLI 本身</div>
<div class="ny-doc-command">
<code>nylo self-update</code>
<span>将 nylo 更新到最新版本</span>
</div>
<div class="ny-doc-command">
<code>nylo --version</code>
<span>显示已安装的版本</span>
</div>
</div>

带选项的命令可以通过 `-h` 列出这些选项，例如 `nylo test -h`。测试相关内容请参阅[运行测试](/docs/7.x/testing#running-tests)，`locale:` 相关命令请参阅[审计翻译](/docs/7.x/localization#auditing-translations)。

<div id="nylo-clean"></div>

### 清理项目

`nylo clean` 会运行 `flutter clean`，然后运行 `flutter pub get`。当常规清理不够时，添加平台标志：

``` bash
# 运行 flutter clean，然后运行 flutter pub get
nylo clean

# 同时删除 ios/Pods、ios/.symlinks 和 ios/Podfile.lock，然后运行 pod install --repo-update
nylo clean --ios

# 同时在 android/ 中运行 gradlew clean
nylo clean --android

# 以上两者同时执行
nylo clean --all
```

如果项目没有 `ios/` 或 `android/` 文件夹，该平台会被跳过并显示警告。`pod install` 仅在 macOS 上运行。

<div id="nylo-ios-pod-refresh"></div>

### 刷新 iOS Pod

当 CocoaPods 不同步时，`nylo ios:pod-refresh` 会删除 `ios/Pods`、`ios/.symlinks` 和 `ios/Podfile.lock`，然后在 `ios/` 文件夹中运行 `pod install --repo-update`：

``` bash
nylo ios:pod-refresh
```

请在 macOS 上从项目根目录运行它。与 `nylo clean --ios` 不同，它不会运行 `flutter clean` 或 `flutter pub get`。

<div id="nylo-metro"></div>

### 不使用别名运行 Metro

`nylo metro` 会将其后的所有内容传递给 Metro（`dart run nylo_framework:main`）。请在尚未运行 `nylo init` 之前，或在 Windows 上（`nylo init` 无法为您添加 `metro` 别名）使用它：

``` bash
nylo metro make:page settings_page
nylo metro make:model User
```

<div id="nylo-self-update"></div>

### 更新 CLI

``` bash
nylo self-update
```

此命令会检查 pub.dev，如果有更新版本可用，则重新安装 `nylo_installer`。命令执行完成后，`nylo` 也会在有更新时提示您。当输出不是发往终端时，它会保持静默，因此该提示不会出现在 CI 日志或管道输出中。

查看您已安装的版本：

``` bash
nylo --version
```