Một bài viết về các lược đồ
Tính năng này cho phép bạn lấy mô tả thành phần của mình dưới dạng schema Zod an toàn kiểu, cung cấp:
Tìm hiểu thêm: https://zod.dev
Để lấy schema Zod của bạn, bạn sẽ:
cms-rendererapps/
web/
app/
page.tsx
scripts/
generated-schema.ts # file script
generated-schema.tsimport { fetchAllCustomSchemaFields, saveZodSchemaCode } from 'cms-renderer/lib/custom-schemas';
import { cmsConfig } from '../lib/cms-config';
async function main() {
const { cmsUrl, websiteId, apiKey } = cmsConfig;
if (!cmsUrl) {
throw new Error(
'[generate-schemas] NEXT_PUBLIC_CMS_API_URL chưa được thiết lập. Thiết lập nó trong môi trường của bạn hoặc tệp .env.'
);
}
if (!websiteId) {
throw new Error(
'[generate-schemas] CMS_WEBSITE_ID chưa được thiết lập. Thiết lập nó trong môi trường của bạn hoặc tệp .env.'
);
}
if (!apiKey) {
throw new Error(
'[generate-schemas] PROFOUND_API_KEY chưa được thiết lập. Thiết lập nó trong môi trường của bạn hoặc tệp .env.'
);
}
const schemas = await fetchAllCustomSchemaFields({ cmsUrl, websiteId, apiKey });
if (schemas.length === 0) {
throw new Error(
'[generate-schemas] Không có thành phần nào được trả về từ API. Kiểm tra rằng PROFOUND_API_KEY hợp lệ và trỏ đến đúng website.'
);
}
console.log(
`[generate-schemas] Tìm thấy ${schemas.length} thành phần: ${schemas.map((s) => s.name).join(', ')}`
);
await saveZodSchemaCode(schemas, './generated/cms-schemas.ts');
console.log('[generate-schemas] Hoàn tất.');
}
main().catch((err) => {
console.error('[generate-schemas] Thất bại:', err);
process.exit(1);
});
export const cmsConfig = {
cmsUrl: process.env.NEXT_PUBLIC_CMS_API_URL,
apiKey: process.env.CMS_API_KEY,
websiteId: '...',
};
package.jsonLưu ý: Nếu bạn không có
tsconfig.json, hãy bỏ cờ--tsconfig.
{
"name": "web",
"version": "0.1.0",
"type": "module",
"private": true,
"scripts": {
"generate-schemas": "tsx --tsconfig tsconfig.json scripts/generate-schemas.ts",
"...": "..."
},
"dependencies": {
"cms-renderer": "0.3.1",
"zod": "^4.3.6",
"...": "..."
},
"devDependencies": {
"tsx": "^4.21.0",
"object-hash": "^3.0.0",
"...": "..."
}
}
bun run generate-schemas
Ví dụ đầu ra:
tsx --tsconfig tsconfig.json scripts/generate-schemas.ts
[generate-schemas] Tìm thấy 3 thành phần: post, categories, header
[generate-schemas] Hoàn tất.
apps/
web/
app/
page.tsx
scripts/
generated-schema.ts
generated/
cms-schemas.ts # schema Zod được tạo
page.tsximport type { PetFoodPost, SiteConfig } from '@/generated/cms-schemas';
import { petFoodPostSchema } from '@/generated/cms-schemas';
// Dùng cho việc phân tích an toàn kiểu
petFoodPostSchema.parse(obj);
bun run generate-schemas