Files
twenty/packages/twenty-docs/l/cs/developers/self-host/capabilities/troubleshooting.mdx
T
Charles Bochet 7a2e397ad1 Complete linaria migration (#18361)
## Summary

Completes the migration of the frontend styling system from **Emotion**
(`@emotion/styled`, `@emotion/react`) to **Linaria** (`@linaria/react`,
`@linaria/core`), a zero-runtime CSS-in-JS library where styles are
extracted at build time.

This is the final step of the migration — all ~494 files across
`twenty-front`, `twenty-ui`, `twenty-website`, and `twenty-sdk` are now
fully converted.

## Changes

### Styling Migration (across ~480 component files)
- Replaced all `@emotion/styled` imports with `@linaria/react`
- Converted runtime theme access patterns (`({ theme }) => theme.x.y`)
to build-time `themeCssVariables` CSS custom properties
- Replaced `useTheme()` hook (from Emotion) with
`useContext(ThemeContext)` where runtime theme values are still needed
(e.g., passing colors to non-CSS props like icon components)
- Removed `@emotion/react` `css` helper usages in favor of Linaria
template literals

### Dependency & Configuration Changes
- **Removed**: `@emotion/react`, `@emotion/styled` from root
`package.json`
- **Added**: `@wyw-in-js/babel-preset`, `next-with-linaria` (for
twenty-website SSR support)
- Updated Nx generator defaults from `@emotion/styled` to
`@linaria/react` in `nx.json`
- Simplified `vite.config.ts` (removed Emotion-specific configuration)
- Updated `twenty-website/next.config.js` to use `next-with-linaria` for
SSR Linaria support

### Storybook & Testing
- Removed `ThemeProvider` from Emotion in Storybook previews
(`twenty-front`, `twenty-sdk`)
- Now relies solely on `ThemeContextProvider` for theme injection

### Documentation
- Removed the temporary `docs/emotion-to-linaria-migration-plan.md`
(migration complete)
- Updated `CLAUDE.md` and `README.md` to reflect Linaria as the styling
stack
- Updated frontend style guide docs across all locales

## How it works

Linaria extracts styles at build time via the `@wyw-in-js/vite` plugin.
All expressions in `styled` template literals must be **statically
evaluable** — no runtime theme objects or closures over component state.

- **Static styles** use `themeCssVariables` which map to CSS custom
properties (`var(--theme-color-x)`)
- **Runtime theme access** (for non-CSS use cases like icon `color`
props) uses `useContext(ThemeContext)` instead of Emotion's `useTheme()`
2026-03-04 00:50:06 +01:00

228 lines
9.1 KiB
Plaintext

---
title: Řešení potíží
---
## Řešení potíží
Pokud narazíte na jakýkoli problém při nastavování prostředí pro vývoj, při aktualizaci své instance nebo při samostatném hostování,
zde jsou některá řešení běžných problémů.
### Vlastní hosting
#### První instalace skončí chybou `password authentication failed for user "postgres"`
🚨 **DŮLEŽITÉ: Toto řešení je POUZE pro nové instalace** 🚨
Pokud máte existující instanci Twenty s produkčními daty, **NEPROVÁDĚJTE** tyto kroky, protože trvale smažou vaši databázi!
Při první instalaci Twenty můžete chtít změnit výchozí heslo pro databázi.
Heslo, které nastavíte během první instalace, se stane trvale uloženým v objemu databáze. Pokud se později pokusíte toto heslo změnit v konfiguraci, aniž byste odstranili starý objem, dojde k chybám autentizace, protože databáze stále používá původní heslo.
⚠️ VAROVÁNÍ: Následující kroky trvale SMAŽÍ veškerá data z databáze! ⚠️
Pokračujte pouze v případě, že se jedná o novou instalaci bez důležitých dat.
K aktualizaci `PG_DATABASE_PASSWORD` musíte:
```sh
# Aktualizovat PG_DATABASE_PASSWORD ve .env
docker compose down --volumes
docker compose up -d
```
#### Nalezeny konce řádků CR [Windows]
Je to způsobeno znaky konce řádku ve Windows a konfigurací gitu. Zkuste spustit:
```
git config --global core.autocrlf false
```
Pak smažte úložiště a naklonujte jej znovu.
#### Chybí schéma metadat
Během instalace Twenty musíte nastavit svou postgres databázi s správnými schématy, rozšířeními a uživateli.
Pokud se vám podaří spustit toto nastavování, měli byste mít ve své databázi schémata `default` a `metadata`.
Pokud ne, ujistěte se, že na vašem počítači neběží více než jedna instance postgres.
#### Nelze najít modul 'twenty-emails' ani jeho odpovídající deklarace typů.
Před spuštěním inicializace databáze musíte sestavit balíček `twenty-emails` s `npx nx run twenty-emails:build`
#### Chybí balíček twenty-x
Ujistěte se, že v kořenovém adresáři spouštíte `yarn` a poté spusťte `npx nx server:dev twenty-server`. Pokud stále nefunguje, zkuste chybějící balíček sestavit ručně.
#### Lint při ukládání nefunguje
Toto by mělo fungovat přímo s nainstalovaným rozšířením eslint. Pokud to nefunguje, zkuste přidat toto do svého nastavení vscode (v rozsahu dev containeru):
```
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "explicit"
}
```
#### Při spuštění `npx nx start` nebo `npx nx start twenty-front` došlo k chybě nedostatku paměti
In `packages/twenty-front/.env` uncomment `VITE_DISABLE_TYPESCRIPT_CHECKER=true` and `VITE_DISABLE_ESLINT_CHECKER=true` to disable background checks thus reducing amount of needed RAM.
**Pokud to nefunguje:**
Spusťte pouze služby, které potřebujete, místo `npx nx start`. Například pokud pracujete na serveru, spusťte pouze `npx nx worker twenty-server`
**Pokud to nefunguje:**
Pokud jste se pokusili spustit pouze `npx nx run twenty-server:start` na WSL a selhává to s následující chybou paměti:
`FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory`
Pro obejití proveďte níže uvedený příkaz v terminálu nebo jej přidejte do profilu .bashrc, aby se automatizovalo nastavení:
`export NODE_OPTIONS="--max-old-space-size=8192"`
Příznak --max-old-space-size=8192 nastavuje horní limit 8 GB pro hromadu v Node.js; využití se škáluje s požadavkem aplikace.
Odkaz: https://stackoverflow.com/questions/56982005/where-do-i-set-node-options-max-old-space-size-2048
**Pokud to nefunguje:**
Analyzujte, které procesy vám zabírají většinu paměti na stroji. V Twenty jsme si všimli, že některá rozšíření VScode zabírala hodně paměti RAM, takže jsme je dočasně deaktivovali.
**Pokud to nefunguje:**
Restartování počítače pomůže vyčistit zombie procesy.
#### Při běhu `npx nx start` se v protokolech objevují podivné [0] a [1]
To je očekávané, protože příkaz `npx nx start` spouští více příkazů v pozadí
#### E-maily nejsou odesílány
Většinou je to proto, že `worker` neběží na pozadí. Zkuste spustit
```
npx nx worker twenty-server
```
#### Nelze připojit můj účet Microsoft 365
Většinou je to proto, že váš administrátor pro váš účet nepovolil licenci Microsoft 365. Zkontrolujte [https://admin.microsoft.com/](https://admin.microsoft.com/Adminportal/Home).
Pokud máte chybový kód `AADSTS50020`, pravděpodobně používáte osobní účet Microsoft. Tento přístup ještě není podporován. Více informací [zde](https://learn.microsoft.com/fr-fr/troubleshoot/entra/entra-id/app-integration/error-code-aadsts50020-user-account-identity-provider-does-not-exist)
#### Při běhu `yarn` se v konzoli objevují varování
Varování informují o načítání dalších závislostí, které nejsou explicitně uvedeny v `package.json`, takže pokud se neobjeví žádná vážná chyba, vše by mělo fungovat podle očekávání.
#### Když uživatel přistoupí na přihlašovací stránku, v protokolech se objeví chybová zpráva o neautorizovaném uživateli, který se snaží přistoupit k pracovnímu prostoru
To je očekávané, protože uživatel je neautorizovaný, když je odhlášen, protože jeho identita není ověřena.
#### Jak zkontrolovat, zda váš worker běží?
* Jděte na [webhook-test.com](https://webhook-test.com/) a zkopírujte **Svou unikátní webhook URL**.
<div style={{textAlign: 'center'}}>
<img src="/images/docs/developers/self-hosting/webhook-test.jpg" alt="Test webhooku" />
</div>
* Otevřete svou Twenty aplikaci, přejděte na `/settings` a na levé dolní části obrazovky aktivujte přepínač **Pokročilé**.
* Vytvořte nový webhook.
* Vložte **Svou unikátní webhook URL** do pole **Endpoint Url** ve Twenty. Nastavte **Filtry** na `Companies` a `Created`.
<div style={{textAlign: 'center'}}>
<img src="/images/docs/developers/self-hosting/webhook-settings.jpg" alt="Nastavení webhooku" />
</div>
* Přejděte na `/objects/companies` a vytvořte nový záznam společnosti.
* Vraťte se na [webhook-test.com](https://webhook-test.com/) a zkontrolujte, zda byla přijata nová **POST request**.
<div style={{textAlign: 'center'}}>
<img src="/images/docs/developers/self-hosting/webhook-test-result.jpg" alt="Výsledek testu webhooku" />
</div>
* Pokud byla přijata **POST request**, váš worker běží úspěšně. V opačném případě je potřeba zkontrolovat váš worker.
#### Front-end se nedaří spustit a vrací chybu TS5042: Možnost 'project' nelze kombinovat se zdrojovými soubory na příkazovém řádku
Zakomentujte plugin checker v `packages/twenty-ui/vite-config.ts` jako v příkladu níže
```
plugins: [
react({ jsxImportSource: 'react' }),
tsconfigPaths(),
svgr(),
dts(dtsConfig),
// checker(checkersConfig),
wyw({
include: [
'**/OverflowingTextWithTooltip.tsx',
'**/Chip.tsx',
'**/Tag.tsx',
'**/Avatar.tsx',
'**/AvatarChip.tsx',
],
babelOptions: {
presets: ['@babel/preset-typescript', '@babel/preset-react'],
},
}),
],
```
#### Administrační panel není přístupný
Spusťte `UPDATE core."user" SET "canAccessFullAdminPanel" = TRUE WHERE email = 'you@yourdomain.com';` v databázovém kontejneru pro získání přístupu k administračnímu panelu.
### Docker Compose jedním kliknutím
#### Nelze se přihlásit
Pokud se nemůžete přihlásit po nastavení:
1. Spusťte následující příkazy:
```bash
docker exec -it twenty-server-1 yarn
docker exec -it twenty-server-1 npx nx database:reset --configuration=no-seed
```
2. Restartujte Docker kontejnery:
```bash
docker compose down
docker compose up -d
```
Poznámka: příkaz database:reset kompletně smaže vaši databázi a vytvoří ji znovu od základu.
#### Problémy s připojením za reverzní proxy
Pokud provozujete Twenty za reverzní proxy a máte problémy s připojením:
1. **Ověřte SERVER_URL:**
Ujistěte se, že `SERVER_URL` ve vašem `.env` souboru odpovídá vaší externí přístupové URL, včetně `https`, pokud je SSL povoleno.
2. **Zkontrolujte nastavení reverzní proxy:**
* Potvrďte, že vaše reverzní proxy správně směruje požadavky na server Twenty.
* Ujistěte se, že záhlaví jako `X-Forwarded-For` a `X-Forwarded-Proto` jsou správně nastaveny.
3. **Restartujte služby:**
Po provedení změn restartujte jak reverzní proxy, tak kontejnery Twenty.
#### Chyba při nahrávání obrázku - přístup odepřen
Změna vlastnictví datové složky na hostiteli z uživatele root na jiného uživatele a skupinu tento problém vyřeší.
## Získání pomoci
Pokud se setkáte s problémy, které tento průvodce nepokrývá:
* Zkontrolujte protokoly:
Zobrazte protokoly kontejneru kvůli chybovým zprávám:
```bash
docker compose logs
```
* Podpora komunity:
Obraťte se na [komunitu Twenty](https://github.com/twentyhq/twenty/issues) nebo [podpůrné kanály](https://discord.gg/cx5n4Jzs57) pro pomoc.