nuxt-typo3

基於 Nuxt 和 Vue.js 的 TYPO3 Headless 前端渲染模組

• ✨ 釋出說明
• 📖 文件

功能

• 🌐 處理 Headless EXT 提供的動態 API 路由
• 🖼️ 前端和後端佈局
• 🧩 支援大多數標準 TYPO3 內容元素
• ✨ 易於定製
• 🌍 多語言支援
• 📈 SEO 支援
• 🚀 支援服務端渲染

設定

瞭解如何在 Nuxt 3 應用程式中設定 nuxt-typo3 模組。

您也可以在 StackBlitz 上使用演示環境

啟動 nuxt-typo3 專案

您可以使用 nuxi init 命令初始化一個全新的 Nuxt 專案，並進行所需的 nuxt-typo3 設定。瞭解更多關於 nuxi

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 部分

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

檢視 Nuxt 3 文件 以獲取有關安裝和使用模組的更多資訊。

開發

• 執行 npm run dev:prepare 以生成型別存根。
• 使用 npm run dev 在開發模式下啟動 演示環境。