Aggiungere EmDash a un progetto Astro esistente

npm create emdash@latest fornisce un progetto pre-configurato, ma EmDash si integra anche in un sito Astro esistente. Questa guida illustra ogni requisito che il template di partenza normalmente gestisce per te.

Prerequisiti

Astro 6 o successivo — aggiorna prima se sei su una versione major precedente (npx @astrojs/upgrade)
Node.js v22.12.0 o superiore (le versioni dispari non sono supportate)
Output server — EmDash serve contenuti a runtime, il tuo progetto necessita di output: "server" e un adapter

Installare i pacchetti

npm

npm install emdash @astrojs/react react react-dom

pnpm

pnpm add emdash @astrojs/react react react-dom

yarn

yarn add emdash @astrojs/react react react-dom

Per un database SQLite locale:

npm install better-sqlite3

Registrare le integrazioni

import { defineConfig } from "astro/config";
import node from "@astrojs/node";
import react from "@astrojs/react";
import emdash, { local } from "emdash/astro";
import { sqlite } from "emdash/db";

export default defineConfig({
	output: "server",
	adapter: node({ mode: "standalone" }),
	integrations: [
		react(),
		emdash({
			database: sqlite({ url: "file:./data.db" }),
			storage: local({
				directory: "./uploads",
				baseUrl: "/_emdash/api/media/file",
			}),
		}),
	],
});

Aggiungere il loader delle live collection

import { defineLiveCollection } from "astro:content";
import { emdashLoader } from "emdash/runtime";

export const collections = {
	_emdash: defineLiveCollection({ loader: emdashLoader() }),
};

Verificare l’installazione

Avvia il server di sviluppo:
```
npm run dev
```
Apri http://localhost:4321/_emdash/admin e completa la procedura guidata di configurazione.

Crea e pubblica un post, poi interrogalo da una pagina:

---
import { getEmDashCollection } from "emdash";

const { entries: posts } = await getEmDashCollection("posts", {
	status: "published",
});
---

<ul>{posts.map((post) => <li>{post.data.title}</li>)}</ul>

Distribuire su Cloudflare

Segui Distribuire su Cloudflare per la configurazione completa.

Risoluzione dei problemi

Sintomo	Causa	Soluzione
Admin bloccato su “Loading EmDash…”	`@astrojs/react` non registrato	Aggiungere `react()` alle `integrations`
`Could not resolve "astro:content"`	Astro precedente alla 6	Aggiornare Astro
`getEmDashCollection` restituisce errore	`src/live.config.ts` mancante	Aggiungere il loader
Errori di build	Dipendenze peer non installate	Installare `@astrojs/react`, `react`, `react-dom`
Le modifiche al contenuto non appaiono	Pagina pre-renderizzata	Impostare `export const prerender = false`