런타임 설정
이 API는 아직 개발 중이며, 더 많은 기능이 곧 추가될 예정입니다!
<srcDir>/app.config.ts
파일에서 런타임 설정을 정의할 수 있습니다:
ts
import { defineAppConfig } from 'wxt/sandbox';
// 설정에 대한 타입 정의
declare module 'wxt/sandbox' {
export interface WxtAppConfig {
theme?: 'light' | 'dark';
}
}
export default defineAppConfig({
theme: 'dark',
});
WARNING
이 파일은 저장소에 커밋되므로, 여기에 비밀 정보를 넣지 마세요. 대신 환경 변수를 사용하세요.
런타임 설정에 접근하려면 WXT가 제공하는 useAppConfig
함수를 사용합니다:
ts
import { useAppConfig } from 'wxt/sandbox';
console.log(useAppConfig()); // { theme: "dark" }
앱 설정에서 환경 변수 사용하기
app.config.ts
파일에서 환경 변수를 사용할 수 있습니다.
ts
declare module 'wxt/sandbox' {
export interface WxtAppConfig {
apiKey?: string;
skipWelcome: boolean;
}
}
export default defineAppConfig({
apiKey: import.meta.env.WXT_API_KEY,
skipWelcome: import.meta.env.WXT_SKIP_WELCOME === 'true',
});
이 방식에는 여러 장점이 있습니다:
- 모든 환경 변수를 한 파일에서 정의할 수 있음
- 문자열을 불리언이나 배열 같은 다른 타입으로 변환 가능
- 환경 변수가 제공되지 않을 때 기본값을 설정할 수 있음