ДокументацияСборка и тестирование
Фронтенд
Nexy не поставляет клиенту собственную систему компонентов. Он основан на Vite: поддерживаются React, Vue, Svelte, Solid и Preact, а ванильные страницы работают вообще без клиентской платформы.
Включить фреймворк
from nexy.core.models import NexyConfigModelfrom nexy.frontend import react class NexyConfig(NexyConfigModel): useFF = react() # vue(), svelte(), solid(), preact()useVite по умолчанию равно True; оставьте его включенным, когда фреймворк настроен.
Файлы маршрутов
| Расширение | Рендеринг |
|---|---|
.nexy, .md |
от Nexy во время запроса |
.mdx, .tsx, .jsx, .vue, .svelte |
по клиентской платформе; предварительно отображается в HTML во время сборки, а затем передается клиентскому пакету |
Маршрут фреймворка - это обычная страница, а не остров, предназначенный только для клиента: HTML существует до запуска пакета, поэтому первая отрисовка не ждет JavaScript.
Настройка для каждой платформы: React, Vue, Svelte, Solid, Preact.
Развитие
nx dev запускает один сервер на одном порту:
- приложение перекомпилирует измененные вами маршруты, серверные и клиентские;
- Vite работает на внутреннем порту и обслуживает модули платформы;
- Nexy проксирует конечные точки Vite через свой собственный источник.
Браузер обращается только к порту 3000. Нет второго URL-адреса, который нужно открыть, и нет CORS, который нужно настроить.
Построить
nx build производит:
- предварительно обработанный HTML для маршрутов платформы;
- клиентский пакет с активами под
__nexy__/client/; - скомпилированные Python маршруты.
Vite собирает клиентский пакет; серверный HTML каждой страницы компонента записывается во время сборки.
Стиль
nexy new запрашивает режим стиля и настраивает его для выбранной вами клиентской среды: Tailwind, UnoCSS или простой CSS. Токены дизайна (цвета, шрифты, темная тема) - это переменные CSS в src/globale.css, файле, который создает scaffold.
| Режим | Начальные страницы написаны с помощью |
|---|---|
| Tailwind, UnoCSS | служебные классы в разметке, токены которых сопоставлены с именами классов. |
| Обычный CSS | семантические имена классов и CSS в src/globale.css |
При добавлении страницы следуйте режиму вашего проекта: служебные классы в служебном проекте, CSS в простом CSS. Сохраняйте CSS компонента, который утилиты не могут выразить, в блоке <style> компонента. В серверном проекте (страницы .nexy) UnoCSS читает файлы .nexy для классов; Tailwind находит их самостоятельно.
Шрифты, изображения, скрипты
Поместите статические файлы в public/ - они обслуживаются из / как при разработке, так и при производстве.
Следующие шаги
- Просмотры: выберите формат страницы.
- Конфиг:
useFF,useVite, псевдонимы - Развёртывание: что производит сборка