Malin
8d4eaa1489
- Clone all 5 Zonemaster component repos (LDNS, Engine, CLI, Backend, GUI) - Dockerfile.backend: 8-stage multi-stage build LDNS→Engine→CLI→Backend - Dockerfile.gui: Astro static build served via nginx - docker-compose.yml: backend (internal) + frontend (port 5353) - nginx.conf: root redirects to /es/, /api/ proxied to backend - zonemaster-gui/config.ts: defaultLanguage set to 'es' (Spanish) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
82 lines
2.2 KiB
Markdown
82 lines
2.2 KiB
Markdown
# Advanced build-time configuring Zonemaster-GUI using "tsconfig.json"
|
|
|
|
The `tsconfig.json` configuration file can be used for *build-time* settings of
|
|
Zonemaster-GUI. Any changes to this file require a rebuild of the installation
|
|
package.
|
|
|
|
## Finding "tsconfig.json"
|
|
|
|
In the source tree the file is found as `tsconfig.json` relative to the root of
|
|
the Git tree. It does not exist in the installed Zonemaster-GUI, as the values
|
|
have been built-in.
|
|
|
|
## Rebuilding Zonemaster-GUI after update
|
|
|
|
When `tsconfig.json` has been updated, Zonemaster-GUI has to be rebuilt. See
|
|
[building installation package] for how to get the source tree and building a new
|
|
installation package.
|
|
|
|
## Default "tsconfig`.json"
|
|
|
|
The `tsconfig.json` file is a TypeScript configuration file that includes path
|
|
aliases like `@theme/*` to simplify imports and make theming more manageable.
|
|
|
|
|
|
```json
|
|
{
|
|
"extends": "astro/tsconfigs/strict",
|
|
"include": [".astro/types.d.ts", "**/*"],
|
|
"exclude": ["dist"],
|
|
"compilerOptions": {
|
|
"baseUrl": ".",
|
|
"paths": {
|
|
"@/*": ["./src/*"],
|
|
"@theme/*": ["./src/themes/default/*"]
|
|
},
|
|
"resolveJsonModule": true,
|
|
"esModuleInterop": true
|
|
}
|
|
}
|
|
```
|
|
|
|
## @theme/* Alias in "tsconfig.json"
|
|
|
|
The path alias configuration allows importing from the default theme directory
|
|
using the `@theme` prefix, which makes it possible to create a customize the
|
|
look-and-feel of the Zonemaster-GUI, e.g. set other colors and type faces.
|
|
|
|
```json
|
|
{
|
|
"paths": {
|
|
"@/*": ["./src/*"],
|
|
"@theme/*": ["./src/themes/default/*"]
|
|
}
|
|
}
|
|
```
|
|
|
|
This alias makes it easier to import theme-specific components and styles
|
|
in your code. For example, instead of writing:
|
|
|
|
```typescript
|
|
import Button from '../../themes/default/components/Button';
|
|
```
|
|
|
|
You can use:
|
|
|
|
```typescript
|
|
import Button from '@theme/components/Button';
|
|
```
|
|
|
|
This approach simplifies imports and makes it easier to switch between different
|
|
themes by changing the alias path.
|
|
|
|
|
|
## Theming
|
|
|
|
In the [Theming Zonemaster-GUI] document you will find instructions how to add
|
|
custom theming to Zonemaster-GUI.
|
|
|
|
|
|
[Building installation package]: building-custom-gui.md
|
|
[Theming Zonemaster-GUI]: https://github.com/zonemaster/zonemaster-gui/blob/master/docs/theming-zonemaster-gui.md
|