3.8 KiB
Implementeren op Vercel
Vercel biedt de eenvoudigste implementatie-ervaring voor statische sites.
Implementeren met één klik
Handmatig implementeren
Stap 1: Fork de repository
Fork bentopdf/bentopdf naar je GitHub-account.
Stap 2: Importeren in Vercel
- Ga naar vercel.com/new
- Selecteer je geforkte repository
- Configureer het project:
| Instelling | Waarde |
|---|---|
| Framework Preset | Vite |
| Build Command | npm run build |
| Output Directory | dist |
| Install Command | npm install |
Stap 3: Omgevingsvariabelen (optioneel)
Voeg deze toe indien nodig:
| Variabele | Beschrijving |
|---|---|
SIMPLE_MODE |
Stel in op true voor een minimale interface |
VITE_BRAND_NAME |
Eigen merknaam (vervangt "BentoPDF") |
VITE_BRAND_LOGO |
Logopad relatief ten opzichte van public/ (bijv. images/my-logo.svg) |
VITE_FOOTER_TEXT |
Eigen footer-/copyrighttekst |
VITE_DEFAULT_LANGUAGE |
Standaardtaal van de interface (bijv. fr, de, es) |
Stap 4: Implementeren
Klik op "Deploy" en wacht tot de build klaar is.
Eigen domein
- Ga naar de projectinstellingen
- Ga naar "Domains"
- Voeg je eigen domein toe
- Configureer DNS zoals aangegeven
Beperkingen
::: warning Grote bestanden
De serverless functions van Vercel hebben een limiet van 50 MB. Omdat BentoPDF een statische site is, zou dit je niet moeten raken, maar WASM-modules zijn groot (~100 MB in totaal). Zorg dat ze worden aangeboden vanuit de map /public.
:::
Probleemoplossing
Build-timeout
Als builds een timeout geven, probeer dan:
// vercel.json
{
"buildCommand": "npm run build",
"outputDirectory": "dist"
}
404 bij vernieuwen
Voeg een vercel.json toe voor SPA-routing:
{
"rewrites": [{ "source": "/(.*)", "destination": "/index.html" }]
}
Word/ODT/Excel naar PDF werkt niet
LibreOffice WASM-conversies vereisen SharedArrayBuffer, waarvoor deze responsheaders op alle pagina's nodig zijn:
Cross-Origin-Embedder-Policy: require-corpCross-Origin-Opener-Policy: same-origin
De vooraf gecomprimeerde bestanden .wasm.gz en .data.gz hebben ook Content-Encoding: gzip nodig, zodat de browser ze decomprimeert.
Voeg deze toe aan je vercel.json:
{
"rewrites": [{ "source": "/(.*)", "destination": "/index.html" }],
"headers": [
{
"source": "/(.*)",
"headers": [
{ "key": "Cross-Origin-Embedder-Policy", "value": "require-corp" },
{ "key": "Cross-Origin-Opener-Policy", "value": "same-origin" },
{ "key": "Cross-Origin-Resource-Policy", "value": "cross-origin" }
]
},
{
"source": "/libreoffice-wasm/soffice.wasm.gz",
"headers": [
{ "key": "Content-Type", "value": "application/wasm" },
{ "key": "Content-Encoding", "value": "gzip" }
]
},
{
"source": "/libreoffice-wasm/soffice.data.gz",
"headers": [
{ "key": "Content-Type", "value": "application/octet-stream" },
{ "key": "Content-Encoding", "value": "gzip" }
]
}
]
}
Controleer dit door de DevTools-console te openen en console.log(window.crossOriginIsolated) uit te voeren: het moet true teruggeven.