# nuxt-typo3

> TYPO3 Frontend rendered in Vue.js and Nuxt (frontend for EXT:headless)

Latest version **1.4.0** (published 2024-10-23) · MIT license · 0 weekly downloads

## Install

```sh
npm install nuxt-typo3
pnpm add nuxt-typo3
yarn add nuxt-typo3
bun add nuxt-typo3
```

## Health

**Score 45/100 (D)** — status: stable.

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support.

Negative: stale.

## Facts

| | |
|---|---|
| Version | 1.4.0 |
| Published | 2024-10-23 |
| First published | 2019-10-11 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 6 |
| Unpacked size | 121.5 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 100 |
| Author | Macopedia |
| Maintainers | mateusznarowski, tmotyl, m.galezewski, mercs600 |
| Keywords | typo3, headless, nuxt, vue |

## Links

- npm: https://www.npmjs.com/package/nuxt-typo3
- Repository: https://github.com/TYPO3-Initiatives/nuxt-typo3
- Homepage: https://github.com/TYPO3-Initiatives/nuxt-typo3#readme
- Issues: https://github.com/TYPO3-Initiatives/nuxt-typo3/issues
- npm.io page: https://npm.io/package/nuxt-typo3

## Dependencies (6)

- [defu](https://npm.io/package/defu.md) ^6.1.2
- [scule](https://npm.io/package/scule.md) ^0.3.2
- [consola](https://npm.io/package/consola.md) ^2.15.3
- [hookable](https://npm.io/package/hookable.md) ^5.5.3
- [vee-validate](https://npm.io/package/vee-validate.md) ^3.4.14
- [@nuxtjs/axios](https://npm.io/package/@nuxtjs/axios.md) ^5.13.6

## Recent versions

- 1.4.0 (latest) — 2024-10-23
- 1.2.3-alpha.0 (alpha) — 2023-04-17
- 1.3.4 — 2023-11-08
- 1.3.3 — 2023-10-17
- 1.3.2 — 2023-07-21
- 1.3.1 — 2023-06-29
- 1.3.0 — 2023-06-19
- 1.2.4 — 2023-04-17
- 1.2.3 — 2023-04-17
- 1.2.2 — 2023-02-20
- 1.2.2-alpha.0 — 2023-02-17
- 1.2.1 — 2023-02-17
- 1.2.0 — 2023-02-02
- 1.2.0-alpha.0 — 2023-01-30
- 1.1.1 — 2023-01-19
- … 27 more at https://npm.io/package/nuxt-typo3/versions

## README

<p align="center">
  <img align="center" width="500" src="docs/static/nuxt_typo3.svg" alt="nuxt-typo3">
</p>
<p align="center">
  <a href="https://npmjs.com/package/nuxt-typo3"><img src="https://img.shields.io/npm/v/nuxt-typo3/latest.svg?style=flat-square" alt="npm downloads"></a>
  <a href="https://npmjs.com/package/nuxt-typo3"><img src="https://img.shields.io/npm/dt/nuxt-typo3.svg?style=flat-square" alt="npm version"></a>
  <a href="https://standardjs.com"><img src="https://img.shields.io/badge/code_style-standard-brightgreen.svg?style=flat-square" alt="standard js"></a>
  <a href="https://www.npmjs.com/package/nuxt-typo3"><img src="https://img.shields.io/npm/l/nuxt-typo3.svg?style=flat-square" alt="License"></a>
</p>

#### TYPO3 module for [Nuxt.js](https://nuxtjs.org) and [TYPO3 headless](https://github.com/TYPO3-Initiatives/headless) provides API handling and frontend rendering.

#### TYPO3 & Headless Ext compability

TYPO3 >= v11.5 & Headless version 3.x -> nuxt-typo3@1.x.x (master)

TYPO3 < 11.5 & Headless version 2.x -> nuxt-typo3@0.x.x [(0.9x)](https://github.com/TYPO3-Headless/nuxt-typo3/tree/0.9x) 
### [DOCUMENTATION](https://typo3-headless.github.io/nuxt-typo3/)

### NUXT3
Are you looking for the newest version compatible with Nuxt3?
https://t3headless.macopedia.io/nuxt-typo3/ 

# Features

✅ Handle dynamic API routes

✅ Frontend layouts

✅ Backend layouts

✅ Multilanguage

✅ Meta tags provided by API

✅ Most of the standard TYPO3 Content Elements

✅ SSR Ready

# Setup

## Installation

Install with yarn

```sh
yarn add nuxt-typo3
```

Install with npm

```sh
npm install nuxt-typo3
```

## Configuration

1. Add `typo3` object to your nuxt.config.js to configure all required settings.

```js
{
  modules: [
    'nuxt-typo3',
  ],

  typo3: {
    baseURL: 'https://yourwebsite.com',
    api: {
      baseURL: 'https://api.yourwebsite.com'
    },
    i18n: {
      locales: ['en', 'pl', 'de'],
      defaultLocale: 'en'
    }
  }
}
```

2. By default this plugin uses dynamic routing (`_.vue`), please remove `index.vue` from pages directory - now your pages provides TYPO3 API. 

## See In action

- [Macmillan English](https://www.macmillanenglish.com)
- [jwied agency](https://www.jwied.de)
- [Karta Multisport](https://www.kartamultisport.pl/)
- [Raben Group](https://raben-group.com/)
- [Robomow.com](https://www.robomow.com/)
- [Macopedia.com](https://macopedia.com/)

## Development

1. Clone this repository
2. Install dependencies using `yarn install`
3. Start development server using `yarn dev`

Please read [contributing guide](CONTRIBUTING.md)

## License

[MIT License](./LICENSE)

Copyright (c) MACOPEDIA

---
_Source: https://npm.io/package/nuxt-typo3 · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._