Nuxt Nation 大会即将到来。加入我们,时间为 11 月 12 日至 13 日。

typo3
@t3headless/nuxt-typo3

TYPO3 无头前端渲染模块

T3H Logo'

nuxt-typo3

基于 Nuxt 和 Vue.js 的 TYPO3 无头前端渲染模块

特性

  • 🌐 处理由 Headless EXT 提供的动态 API 路由
  • 🖼️ 前端和后端布局
  • 🧩 支持大多数标准的 TYPO3 内容元素
  • ✨ 易于定制
  • 🌍 多语言支持
  • 📈 SEO 支持
  • 🚀 服务器端渲染

设置

了解如何在您的 Nuxt 3 应用程序中设置 nuxt-typo3 模块。

您也可以在 StackBlitz 上使用游乐场

快速启动 nuxt-typo3 项目

您可以使用 nuxi init 命令初始化一个带有必需 nuxt-typo3 设置的新 Nuxt 项目。了解更多关于 nuxi 的信息

npx
npx nuxi@latest init -t gh:TYPO3-Headless/nuxt-typo3-starter <project-name>

安装 nuxt-typo3 模块

@t3headless/nuxt-typo3 开发依赖项添加到您的项目中

npx nuxi@latest module add typo3

然后,将 @t3headless/nuxt-typo3 添加到 Nuxt 配置的 modules 部分

nuxt.config.ts
export default defineNuxtConfig({
  modules: ['@t3headless/nuxt-typo3'],
  typo3: {
    api: {
      baseUrl: 'https://api.t3pwa.com'
    }
  }
})

查看 Nuxt 3 文档 以获取有关安装和使用模块的更多信息。

开发

  • 运行 npm run dev:prepare 生成类型存根。
  • 使用 npm run dev 在开发模式下启动 游乐场