Azure

Azure 静态 Web 应用

¥Azure static web apps

预设：azure

¥Preset: azure

Azure 静态 Web 应用 设计为在 GitHub Actions 工作流程 中持续部署。默认情况下，Nitro 会检测此部署环境并启用 azure 预设。

¥Azure Static Web Apps are designed to be deployed continuously in a GitHub Actions workflow. By default, Nitro will detect this deployment environment and enable the azure preset.

本地预览

¥Local preview

如果你想在本地测试，请安装 Azure Functions Core 工具。

¥Install Azure Functions Core Tools if you want to test locally.

你可以在部署前调用开发环境进行预览。

¥You can invoke a development environment to preview before deploying.

NITRO_PRESET=azure npx nypm@latest build
npx @azure/static-web-apps-cli start .output/public --api-location .output/server

配置

¥Configuration

Azure 静态 Web 应用使用 staticwebapp.config.json 文件进行 configured 操作。

¥Azure Static Web Apps are configured using the staticwebapp.config.json file.

每当使用 azure 预设构建应用时，Nitro 都会自动生成此配置文件。

¥Nitro automatically generates this configuration file whenever the application is built with the azure preset.

Nitro 将根据以下条件自动添加以下属性：

¥Nitro will automatically add the following properties based on the following criteria:

自定义配置

¥Custom configuration

你可以使用 azure.config 选项修改 Nitro 生成的配置。

¥You can alter the Nitro generated configuration using azure.config option.

自定义路由将首先添加和匹配。如果发生冲突（确定对象是否具有相同的路由属性），自定义路由将覆盖生成的路由。

¥Custom routes will be added and matched first. In the case of a conflict (determined if an object has the same route property), custom routes will override generated ones.

通过 GitHub Actions 从 CI/CD 部署

¥Deploy from CI/CD via GitHub actions

将 GitHub 存储库链接到 Azure 静态 Web 应用时，工作流文件将添加到存储库中。

¥When you link your GitHub repository to Azure Static Web Apps, a workflow file is added to the repository.

当系统要求你选择框架时，请选择“自定义”并提供以下信息：

¥When you are asked to select your framework, select custom and provide the following information:

如果你遗漏了此步骤，你可以随时在工作流程中找到构建配置部分并更新构建配置：

¥If you miss this step, you can always find the build configuration section in your workflow and update the build configuration:

###### Repository/Build Configurations ######
app_location: '/'
api_location: '.output/server'
output_location: '.output/public'
###### End of Repository/Build Configurations ######

就这样！现在，Azure 静态 Web 应用将在推送时自动部署你的 Nitro 应用。

¥That's it! Now Azure Static Web Apps will automatically deploy your Nitro-powered application on push.

如果你正在使用 RuntimeConfig，你可能需要配置相应的 Azure 上的环境变量 文件。

¥If you are using runtimeConfig, you will likely want to configure the corresponding environment variables on Azure.

Azure 函数

¥Azure functions

预设：azure_functions

¥Preset: azure_functions

::important 如果你遇到任何问题，请确保你使用的是 Node.js 16+ 运行时。你可以找到更多关于 如何在 Azure 文档中设置 Node 版本 的信息。请参阅 nitrojs/nitro#2114 了解一些常见问题。::

¥::important If you encounter any issues, please ensure you're using a Node.js 16+ runtime. You can find more information about how to set the Node version in the Azure docs. Please see nitrojs/nitro#2114 for some common issues. ::

本地预览

¥Local preview

如果你想在本地测试，请安装 Azure Functions Core 工具。

¥Install Azure Functions Core Tools if you want to test locally.

你可以从无服务器目录调用开发环境。

¥You can invoke a development environment from the serverless directory.

NITRO_PRESET=azure_functions npx nypm@latest build
cd .output
func start

现在，你可以在浏览器中访问 http://localhost:7071/，并浏览在 Azure Functions 上本地运行的网站。

¥You can now visit http://localhost:7071/ in your browser and browse your site running locally on Azure Functions.

从本地机器部署

¥Deploy from your local machine

要部署，只需运行以下命令：

¥To deploy, just run the following command:

# To publish the bundled zip file
az functionapp deployment source config-zip -g <resource-group> -n <app-name> --src dist/deploy.zip
# Alternatively you can publish from source
cd dist && func azure functionapp publish --javascript <app-name>

通过 GitHub Actions 从 CI/CD 部署

¥Deploy from CI/CD via GitHub actions

首先，获取你的 Azure Functions 发布配置文件，并将其作为密钥添加到 这些说明 之后的 GitHub 存储库设置中。

¥First, obtain your Azure Functions Publish Profile and add it as a secret to your GitHub repository settings following these instructions.

然后创建以下文件作为工作流：

¥Then create the following file as a workflow:

name: azure
on:
  push:
    branches:
      - main
  pull_request:
    branches:
      - main
jobs:
  deploy:
    runs-on: ${{ matrix.os }}
    strategy:
      matrix:
        os: [ ubuntu-latest ]
        node: [ 14 ]
    steps:
      - uses: actions/setup-node@v2
        with:
          node-version: ${{ matrix.node }}

      - name: Checkout
        uses: actions/checkout@master

      - name: Get yarn cache directory path
        id: yarn-cache-dir-path
        run: echo "::set-output name=dir::$(yarn cache dir)"

      - uses: actions/cache@v2
        id: yarn-cache
        with:
          path: ${{ steps.yarn-cache-dir-path.outputs.dir }}
          key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
          restore-keys: |
            ${{ runner.os }}-yarn-azure

      - name: Install Dependencies
        if: steps.cache.outputs.cache-hit != 'true'
        run: yarn

      - name: Build
        run: npm run build
        env:
          NITRO_PRESET: azure_functions

      - name: 'Deploy to Azure Functions'
        uses: Azure/functions-action@v1
        with:
          app-name: <your-app-name>
          package: .output/deploy.zip
          publish-profile: ${{ secrets.AZURE_FUNCTIONAPP_PUBLISH_PROFILE }}

优化 Azure 函数

¥Optimizing Azure functions

考虑使用 启用不可变包 来支持从 zip 文件运行你的应用。这可以加快冷启动速度。

¥Consider turning on immutable packages to support running your app from the zip file. This can speed up cold starts.