目前只默认支持官方 Astro 集成(发布在 npm 的 @astrojs/ 范围包),以保护用户不被破坏。使用集成 Astro 文档安装有两种方法可以将集成添加到项目中。让我们先介绍最方便的选项! *文件以应用此集成要安装 @astrojs/vue,请在项目目录运行以下命令并按照提示操作:# Using NPMnpx astro add vue# Using Yarnyarn astro add vue# Using PNPMpnpm astro add vue手动安装依赖安装@astrojs/vue集成 npm install @astrojs/vue 大多数包管理器也会安装相关的对等依赖项 *以应用集成 import vue from '@astrojs/vue'; export default { // ... import vue from '@astrojs/vue';export default { // ...
node# Using Yarnyarn astro add node# Using PNPMpnpm astro add node手动安装:在终端中安装Node.js适配器 npm install @astrojs 项目配置文件中添加两行 // astro.config.mjs import { defineConfig } from 'astro/config'; import node from '@astrojs defineConfig({ output: 'server', adapter: node({ mode: 'standalone' }), });配置项参数@astrojs import { defineConfig } from 'astro/config'; import node from '@astrojs/node'; export default defineConfig
和 Tailwind 集成: Yarn: # 升级到 Astro v3.x yarn add astro@latest # 示例:升级 React 和 Tailwind 集成 yarn add @astrojs /react@latest @astrojs/tailwind@latest 更新中。。。
和 TAIlwind 集成: yarn: # 升级到 Astro v3.x yarn add astro@latest # 示例:升级 React 和 Tailwind 集成 yarn add @astrojs /react@latest @astrojs/tailwind@latest 更新中。。。
git:(master) ✗ cat astro.config.mjs import { defineConfig } from "astro/config"; import mdx from "@astrojs /mdx"; import sitemap from "@astrojs/sitemap"; import tailwind from "@astrojs/tailwind"; import vercel from "@astrojs/vercel/static"; import partytown from "@astrojs/partytown"; // https://astro.build/config
之后开始尝试迁移 @astrojs/node 包的测试套件。这个集成是 Astro 下载量最大的集成之一。 根据其博客描述,对最终的结果是感到满意的。在迁移之后没有看到性能出现任何显著退化。
add react在 astro.config.mjs 配置文件中添加如下import { defineConfig } from 'astro/config';import react from "@astrojs
npm create astro@latest要升级现有项目,可以使用自动化的@astrojs/upgrade命令行工具。或者,通过运行包管理器的安装命令手动进行升级。 # Recommended:npx @astrojs/upgrade# Manual:npm install astropnpm install astroyarn add astro查看我们的升级指南以获取此版本每次变更的完整详细信息和单独的升级指导
可以通过运行下列任一命令来实现: npx @astrojs/upgrade npm install astro@latest pnpm upgrade astro --latest yarn upgrade
迁移后:展开代码语言:JavaScriptAI代码解释//astro.config.mjsimport{defineConfig}from'astro/config';importreactfrom'@astrojs
核心代码逻辑如下:```astro---//src/components/StarlightFooter.astro//1.引入原始组件以保留其默认功能importDefaultFooterfrom'@astrojs
Astro内置了对Markdown的支持,但为了处理.mdx文件,你需要安装@astrojs/mdx[5]进行集成。在本教程中,我们坚持使用标准的Markdown内容。 embed=1&file=src/styles/global.css [5] @astrojs/mdx: https://docs.astro.build/en/guides/integrations-guide