Wasp TS 구성: 향상된 코드 구성을 위한 전략
v0.15에 도입된 Wasp의 TS 구성은 다중 Wasp 파일 지원 및 향상된 편집기 통합과 같은 기능을 통해 개발을 단순화하는 것을 목표로 했습니다. 향후 릴리스에서는 직접 다중 파일 지원이 계획되어 있지만 이미 코드 구성을 개선하고 main.wasp.ts
.
방법: 모듈화 구성
이 접근 방식에는 다양한 구성 섹션(페이지, 작업, 쿼리, 작업 등)을 별도의 모듈로 추출하는 작업이 포함됩니다. 이를 통해 가독성과 유지 관리성이 향상됩니다.
1부: 페이지 정의 분리
페이지 정의를 분리하기 위해 전용 구성 파일(예: pages.config.ts
)을 생성할 수 있습니다.
1단계: 만들기 pages.config.ts
이 파일은 제공된 app
인스턴스를 기반으로 페이지 구성을 생성하는 함수를 내보냅니다.
<code class="language-typescript">// pages.config.ts export const pagesConfig = (app: any) => { const landingPage = app.page('LandingPage', { component: { importDefault: 'LandingPage', from: '@src/landing-page/LandingPage' } }); // ... other pages return { landingPage, // ... other pages }; };</code>
이 파일을 전용 디렉터리(예: wasp-config
)에 저장하는 것이 좋습니다.
2단계: pages.config.ts
main.wasp.ts
에서
pagesConfig
함수를 가져오고 app
인스턴스를 전달합니다.
<code class="language-typescript">// main.wasp.ts import { pagesConfig } from './pages.config.ts'; // ... other code const { landingPage, /* ... other pages */ } = pagesConfig(app); app.route('LandingPageRoute', { path: '/', to: landingPage });</code>
2부: 작업, 쿼리 및 작업 모듈화
작업, 쿼리, 작업에도 동일한 모듈화 전략이 적용됩니다. jobs.config.ts
.
1단계: 만들기 jobs.config.ts
이 파일은 작업 구성을 생성하는 기능을 정의합니다.
<code class="language-typescript">// jobs.config.ts import { JobConfig } from "wasp-config"; export const jobConfigs = (app: any) => { const dailyStatsJobConfig: JobConfig = { executor: 'PgBoss', perform: { fn: { import: 'calculateDailyStats', from: '@src/analytics/stats' } }, entities: ['User', 'DailyStats', 'Logs', 'PageViewSource'] }; return { dailyStatsJobConfig }; };</code>
2단계: jobs.config.ts
main.wasp.ts
에서
페이지 구성과 유사하게 jobConfigs
기능을 가져와 사용하세요.
<code class="language-typescript">// main.wasp.ts import { jobConfigs } from './jobs.config.ts'; // ... other code const { dailyStatsJobConfig } = jobConfigs(app); app.job('dailyStatsJob', dailyStatsJobConfig);</code>
결론
이 모듈식 접근 방식은 여러 Wasp 파일에 대한 공식 지원을 기다리는 동안 Wasp 구성 구성을 크게 개선하여 가독성과 유지 관리성을 향상시킵니다. 이 기술은 다중 파일을 직접 지원하지 않고도 복잡한 Wasp 프로젝트를 관리할 수 있는 실용적인 솔루션을 제공합니다. 필요에 따라 쿼리 및 작업에 이 접근 방식을 적용하는 것을 잊지 마세요.
위 내용은 Wasp TS 구성을 분할하시겠습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!