文档构建和测试
前端
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。设计标记(颜色、字体、深色主题)是脚手架创建的文件 src/globale.css 中的 CSS 变量。
| 模式 | 起始页写有 |
|---|---|
| Tailwind,UnoCSS | 标记中的实用程序类,标记映射到类名 |
| 纯CSS | 语义类名和 src/globale.css 中的 CSS |
添加页面时请遵循项目的模式:实用程序项目中的实用程序类,纯 CSS 项目中的 CSS。保留实用程序无法在组件的 <style> 块中表达的组件 CSS。在服务器项目(.nexy 页)中,UnoCSS 读取类的 .nexy 文件; Tailwind 自行找到它们。
字体、图像、脚本
将静态文件放入 public/ - 它们在开发和生产中由 / 提供。