Wasp TS 구성을 분할하시겠습니까?

Wasp TS 구성: 향상된 코드 구성을 위한 전략

v0.15에 도입된 Wasp의 TS 구성은 다중 Wasp 파일 지원 및 향상된 편집기 통합과 같은 기능을 통해 개발을 단순화하는 것을 목표로 했습니다. 향후 릴리스에서는 직접 다중 파일 지원이 계획되어 있지만 이미 코드 구성을 개선하고 main.wasp.ts.

의 크기를 줄일 수 있습니다.

방법: 모듈화 구성

이 접근 방식에는 다양한 구성 섹션(페이지, 작업, 쿼리, 작업 등)을 별도의 모듈로 추출하는 작업이 포함됩니다. 이를 통해 가독성과 유지 관리성이 향상됩니다.

1부: 페이지 정의 분리

페이지 정의를 분리하기 위해 전용 구성 파일(예: pages.config.ts)을 생성할 수 있습니다.

1단계: 만들기 pages.config.ts

이 파일은 제공된 app 인스턴스를 기반으로 페이지 구성을 생성하는 함수를 내보냅니다.

// 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
  };
};

이 파일을 전용 디렉터리(예: wasp-config)에 저장하는 것이 좋습니다.

2단계: pages.config.tsmain.wasp.ts에서

가져오기 및 사용

pagesConfig 함수를 가져오고 app 인스턴스를 전달합니다.

// main.wasp.ts
import { pagesConfig } from './pages.config.ts';
// ... other code

const { landingPage, /* ... other pages */ } = pagesConfig(app);

app.route('LandingPageRoute', { path: '/', to: landingPage });

2부: 작업, 쿼리 및 작업 모듈화

작업, 쿼리, 작업에도 동일한 모듈화 전략이 적용됩니다. jobs.config.ts.

을 사용하여 작업을 시연해 보겠습니다.

1단계: 만들기 jobs.config.ts

이 파일은 작업 구성을 생성하는 기능을 정의합니다.

// 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
  };
};

2단계: jobs.config.tsmain.wasp.ts에서

가져오기 및 사용

페이지 구성과 유사하게 jobConfigs 기능을 가져와 사용하세요.

// main.wasp.ts
import { jobConfigs } from './jobs.config.ts';
// ... other code

const { dailyStatsJobConfig } = jobConfigs(app);

app.job('dailyStatsJob', dailyStatsJobConfig);

결론

이 모듈식 접근 방식은 여러 Wasp 파일에 대한 공식 지원을 기다리는 동안 Wasp 구성 구성을 크게 개선하여 가독성과 유지 관리성을 향상시킵니다. 이 기술은 다중 파일을 직접 지원하지 않고도 복잡한 Wasp 프로젝트를 관리할 수 있는 실용적인 솔루션을 제공합니다. 필요에 따라 쿼리 및 작업에 이 접근 방식을 적용하는 것을 잊지 마세요.

위 내용은 Wasp TS 구성을 분할하시겠습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!