本文属于机器翻译版本。若本译文内容与英语原文存在差异,则一律以英文原文为准。
将 Astro.js 应用程序部署到 Amplify Hosting
按照以下说明,将 Astro.js 应用程序部署到 Amplify Hosting。您可以使用现有应用程序,也可以使用 Astro 提供的正式示例之一创建新手入门应用程序。要创建新手入门应用程序,请参阅《Astro 文档》中的使用主题或新手入门模板
要将带 SSR 的 Astro 站点部署到 Amplify Hosting,您必须向应用程序添加适配器。我们不维护 Amplify 拥有、适用于 Astro 框架的适配器。本教程使用社区成员创建的 astro-aws-amplify
适配器。此适配器可通过 GitHub 网站上的 github.com/alexnguyennz/astro-aws-amplify
将 Astro 应用程序部署到 Amplify Hosting 的方法
-
在本地计算机上,导航到需要部署的 Astro 应用程序。
-
若要安装适配器,请打开一个终端窗口,然后运行以下命令。此示例使用 github.com/alexnguyennz/astro-aws-amplify
上提供的社区适配器。您可以用自己使用的适配器的名称替换 astro-aws-amplify
。npm install
astro-aws-amplify
-
在 Astro 应用程序的项目文件夹中,打开
astro.config.mjs
文件。更新文件以添加适配器。文件应该呈现以下状态。import { defineConfig } from 'astro/config'; import mdx from '@astrojs/mdx';
import awsAmplify from 'astro-aws-amplify';
import sitemap from '@astrojs/sitemap'; // https://astro.build/config export default defineConfig({ site: 'https://example.com', integrations: [mdx(), sitemap()], adapter:awsAmplify()
, output: 'server', }); -
提交更改,并将项目推送到 Git 存储库。
您现在已准备好将 Astro 应用程序部署到 Amplify。
-
登录 AWS Management Console 并打开 Amplify 控制台
。 -
在所有应用程序页面中,选择创建新应用程序。
-
在开始使用 Amplify 进行构建页面中选择您的 Git 存储库提供商,然后选择下一步。
-
在添加存储库分支页面上,执行以下操作:
-
选择需要连接的存储库的名称。
-
选择需要连接的存储库分支的名称。
-
选择下一步。
-
-
在应用程序设置页面中找到构建设置部分。对于构建输出目录,请输入
.amplify-hosting
。 -
您还必须在构建规范中更新应用程序的前端构建命令。要打开构建规范,请选择编辑 YML 文件。
-
在
amplify.yml
文件中,找到前端构建命令部分。输入mv node_modules ./.amplify-hosting/compute/default
您的构建设置文件应如下所示:
version: 1 frontend: phases: preBuild: commands: - 'npm ci --cache .npm --prefer-offline' build: commands: - 'npm run build' - 'mv node_modules ./.amplify-hosting/compute/default' artifacts: baseDirectory: .amplify-hosting files: - '**/*' cache: paths: - '.npm/**/*'
-
选择保存。
-
如果您希望 Amplify 能够将应用程序日志传输到 Amazon CloudWatch Logs,则必须在控制台中显式启用此功能。打开高级设置部分,随后在服务器端渲染(SSR)部署部分中选择启用 SSR 应用程序日志。
-
选择下一步。
-
在查看页面上,选择保存并部署。