탐색
Tools

패키지

공개 패키지를 선택하고 가져오기 경로를 찾으며 GitHub API 소스를 여세요.

이 페이지의 내용

패키지가 담당하는 작업에 따라 선택하세요. 각 절은 공개 가져오기 경로와 현재 GitHub 소스 링크를 제공합니다. 시그니처, 오버로드, 타입은 소스에서 읽으며 이 페이지는 선언을 복제하지 않습니다.

소스 링크는 저장소의 rc 브랜치를 따릅니다. 설치한 릴리스는 해당 패키지의 동봉 선언도 확인하세요.

진입점 선택

작업시작점
프레임워크나 빌드 도구 연결설치 →와 아래의 통합 패키지.
CSS 정의 컴파일 또는 스타일시트 파일 해석@master/css-compiler
컴파일한 정의에서 클래스 규칙 생성@master/css
브라우저 DOM의 클래스 관찰@master/css-runtime
서버 응답 렌더링과 하이드레이션@master/css-server
소스 추출 또는 검증@master/css-tooling
편집기 기능 구현@master/css-language-service
터미널이나 에이전트로 자동화CLI 명령 또는 MCP 도구

컴파일한 manifest는 전달 네이티브 스타일시트를 포함하지 않음

컴파일러는 네이티브 CSS와 정의를 별도로 반환합니다. Node 렌더 세션은 제공한 클래스를 유틸리티 CSS로 바꾸며 컴파일러의 네이티브 .card 규칙을 다시 전달하지 않습니다.

텍스트 설명
  1. app.css는 테마 토큰과 네이티브 .card 규칙을 포함합니다. @master/css-compiler/node의 compileManifestSync가 명시적인 기본 manifest로 컴파일합니다.
  2. result.css는 네이티브 규칙을 담습니다. result.manifest는 이후 클래스 생성에 사용할 정의를 담습니다.
  3. @master/css/node의 Node createRenderSessionSync는 해당 manifest를 받습니다. bg-brand를 확보하면 background-color 규칙과 필요한 토큰 리소스를 생성합니다.
  4. 앱은 네이티브 CSS와 생성 CSS를 모두 전달하고 공유 리소스 소유권을 조정해야 합니다. 브라우저 엔진은 이 Node manifest 경로가 아닌 컴파일한 런타임 프로그램을 사용합니다.

manifest는 정의를 설명하며 네이티브 스타일시트가 아닙니다. 렌더링 모드의 유틸리티 출력과 함께 컴파일러의 네이티브 CSS도 전달하세요. Node 엔진은 manifest를, 브라우저 엔진은 컴파일한 런타임 프로그램을 사용합니다. 전달 경로 선택은 렌더링 모드를 참고하세요.

@master/css-astro

Master CSS를 Astro 설정과 요청 처리에 연결합니다. 통합은 빌드 동작을 설정하고 middleware 진입점은 Astro 요청 훅을 제공합니다.

가져오기 경로용도
@master/css-astroAstro 통합 팩토리와 옵션.
@master/css-astro/middlewareAstro 요청 middleware.

Astro 설정에서 기본 통합 팩토리를 사용하세요. 빌드와 middleware 설정은 Astro 설치를 참고하세요.

소스와 README · 공개 내보내기 매핑

@master/css-compiler

스타일시트 지시문을 컴파일하고 프로젝트 manifest를 불러오며 생성 CSS와 작성한 스타일을 합성합니다. 작업과 실행 환경에 맞는 진입점을 선택하세요.

가져오기 경로용도
@master/css-compiler비동기 컴파일러 세션과 메모리 내 지시문 컴파일.
@master/css-compiler/node동기 네이티브 컴파일과 파일시스템 해석.
@master/css-compiler/project비동기 프로젝트 진입점 탐색과 manifest 로딩.
@master/css-compiler/project/sync동기 프로젝트 진입점 탐색과 manifest 로딩.
@master/css-compiler/stylesheetNode.js 스타일시트 해석, 합성, 전달 에셋.
@master/css-compiler/stylesheet/browser제공한 소스와 기본 manifest를 사용하는 브라우저 컴파일.
@master/css-compiler/diagnostics클래스, 파일, 진단을 포함한 프로젝트 검사 보고서.

API가 기본 manifest를 요구하면 명시적으로 제공하세요. 결과 사용 전에 반환 진단을 검사하세요. 전달 결과는 에셋 집합이므로 모든 스타일시트와 리소스를 지정 URL에 게시해야 합니다. 해석과 전달 경계는 가져오기를 참고하세요.

파일 컴파일 게시

compileManifestFileSync(file, { baseManifest, delivery })는 파일 그래프를 읽고 쓰기 없이 에셋을 반환합니다. delivery는 entryURL, stylesheetURL(file), resourceURL(file)을 제공합니다. 서로 다른 스타일시트에는 서로 다른 최종 URL을 지정하세요. 모든 stylesheets 항목을 href에 게시하고 각 resources 항목을 file에서 href로 복사하세요. 최상위 css, nativeCSS, generatedCSS는 진입점만 설명합니다. 상대 리소스 URL은 원래 소스 소유자, 쿼리, 프래그먼트를 유지하며 참조 전용 스타일시트는 게시 에셋이 되지 않습니다. 누락 리소스와 스타일시트 URL 충돌은 게시 전에 실패합니다. delivery를 생략하면 이 에셋 게시 규칙 없이 단일 문자열 결과를 반환합니다.

preserveNativeCSS의 기본값은 true입니다. 명시적 false는 원시 네이티브 CSS를 억제하지만 포함된 출력의 컴파일된 네이티브 믹스인 적용은 유지합니다. 가지치기를 활성화하지는 않습니다. 스타일시트 집합은 includeNativeCSS, includeMasterBaseCSS, includeGeneratedCSS로 네이티브 CSS, Master 기본 CSS, 생성 유틸리티를 각각 선택합니다. 네이티브 출력 제외는 생성 유틸리티가 쓰는 정의를 제거하지 않습니다. 파일 정책은 네이티브 가지치기를 참고하세요.

기본 validation: 'report'는 결과를 유지하며 진단을 검사합니다. validation: 'error'는 에셋 반환 전에 전체 결과의 알려진 무효 CSS를 거부하며 알 수 없는 기능만으로는 실패하지 않습니다. 사용 가능한 소스 맵이 있으면 범위 진단은 원래 스타일시트 소스를 가리킵니다. 생성 구간을 매핑할 수 없는 호스트 변환은 원래 위치를 만들어 내면 안 됩니다.

다른 변환기를 위한 네이티브 CSS 준비

다른 변환기에 스타일시트의 변경하지 않은 네이티브 부분이 필요하면 호스트는 preserveNativeSource: true를 활성화할 수 있습니다. Master 정의는 여전히 소비하고 네이티브 @apply 규칙도 변환하지만 무관한 주석, 빈 규칙, 값 표기, 규칙 경계는 유지합니다. 기본값 false는 컴파일러의 일반 네이티브 CSS 정규화를 유지합니다.

소스 보존은 활성 네이티브 가지치기와 함께 쓸 수 없습니다. 클래스 목록만 전달해도 가지치기가 활성화되지는 않습니다. preserveNativeCSS: false는 여전히 네이티브 출력을 억제합니다. 이 옵션은 후속 호스트 변환의 최적화나 소스 맵 재작성을 막지 않으며 뒤의 변환이 도입한 Master 정의나 생성 전역 참조를 탐색하지 않습니다.

호스트 변환 뒤 리소스 렌더링 계속하기

다른 출력이 생성 테마 변수나 키프레임 정의를 이미 제공하면 compileRenderedStylesheet()와 compileBrowserStylesheet()에 선택적 emittedGlobals 리소스 수 스냅샷을 전달할 수 있습니다. 양수는 중복 출력을 억제하고 0은 억제하지 않습니다. 새 참조가 의존하는 모든 리소스도 계속 출력합니다. 반환 스냅샷은 입력을 바꾸지 않고 외부 맥락과 이번 렌더링에 필요한 리소스를 포함합니다. 옵션 생략 시 일반 독립 렌더링을 유지합니다.

이 맥락은 후속 렌더링이 이미 처리한 변수를 원래 manifest 값으로 되돌리지 않게 합니다. 새 생성 CSS에 호스트 플러그인을 실행하지는 않습니다. 호스트는 플러그인 순서와 소스 소유권을 유지하며 새 CSS 처리와 리소스 게시를 담당합니다.

소스와 README · 공개 내보내기 매핑

@master/create-css

기존 프로젝트의 Master CSS 설정을 계획하고 적용합니다. 계획은 적용 전에 의존성 변경, 파일 편집, 명령, 경고를 설명합니다.

가져오기 경로용도
@master/create-css설정 계획과 적용, 해당 옵션 및 결과 타입.

planMasterCSSSetup()을 호출해 제안 변경을 검사하세요. applyMasterCSSSetupPlan()은 쓰기 전에 기록한 파일 전제 조건을 검사하므로 파일이 바뀌면 새 계획을 만드세요. 설정은 프로젝트 파일을 수정하고 의존성을 설치할 수 있습니다. 대화형 흐름은 설치를 참고하세요.

소스와 README · 공개 내보내기 매핑

@master/css

컴파일한 manifest나 런타임 프로그램을 실행하고 클래스 이름의 규칙을 생성하며 엔진 상태를 검사합니다. CSS 진입점은 프리셋 스타일시트 레이어를 제공합니다.

가져오기 경로용도
@master/css비동기 엔진 생성과 일회성 클래스 렌더링.
@master/css/nodeNode.js의 동기 네이티브 엔진, 런타임 프로그램 컴파일, 재사용 가능한 렌더 세션.
@master/css/client생성 가상 모듈의 TypeScript 전역 선언.
@master/css/index.css전체 프리셋 스타일시트 진입점.
@master/css/base.css기본 스타일과 안정적인 캐스케이드 레이어 순서.
@master/css/theme.css프리셋 테마 정의.
@master/css/media.css프리셋 뷰포트 및 사용자 환경 설정 조건.
@master/css/container.css프리셋 컨테이너 너비 조건.
@master/css/utilities.css프리셋 유틸리티 등록.

Node.js의 엔진 및 렌더 API에는 명시적인 manifest를 전달하거나 모든 환경에서 compileRuntimeProgram()의 런타임 프로그램을 전달하세요. 브라우저는 프로그램만 실행합니다. 반복 작업에는 세션을 재사용하고 완료 후 해제하세요. 스타일시트 작성과 프로젝트 로딩은 컴파일러, DOM 관찰은 런타임을 사용합니다.

빌드 통합은 ./client에 선언된 가상 모듈로 전달 산출물을 제공합니다. virtual:master-css-manifest는 Node 엔진, 서버 렌더러, 도구용 컴파일한 MasterCSSManifest입니다. virtual:master-css-program은 브라우저 엔진 프로그램이며 프로덕션 빌드에서는 해시가 있는 .bin 에셋입니다. virtual:master-css-emitted-globals는 CSS 진입점이 이미 출력한 변수와 키프레임을 나열해 런타임 중복 생성을 막습니다. 페이지 하이드레이션 manifest는 응답 하나를 설명하는 별도 데이터입니다.

빌드 시점과 서버 생성은 Rust 의미 체계를 사용합니다. 브라우저 엔진은 컴파일한 프로그램을 실행하며 같은 정의와 클래스에 같은 CSS를 생성합니다. 컴파일러, 서버, 런타임은 서로 맞는 릴리스를 사용하세요. 지원하지 않는 실행 또는 언어 버전은 거부됩니다.

executionState(names)는 규칙을 생성하지 않고 중복을 포함한 요청 순서대로 저장된 규칙 참조를 읽습니다. 알 수 없거나 확보하지 않은 클래스의 참조는 비어 있습니다. 전체 규칙과 CSS는 snapshot()을 사용하세요. 브라우저 엔진에는 검사나 렌더 세션이 없습니다. CSS 변경 없는 전환에도 호스트는 리소스 상태를 동기화해야 합니다. 래퍼는 executionState, registerEmittedGlobals, replaceEmittedGlobals, refresh, dispose, Symbol.dispose를 포함한 모든 MasterCSSEngine 멤버를 전달해야 합니다.

소스와 README · 공개 내보내기 매핑

@master/css-svelte-addon

공식 Svelte CLI 애드온은 의존성, Vite 통합, 스타일시트 가져오기, 서버 훅을 포함해 SvelteKit 프로젝트에 Master CSS를 설정합니다.

가져오기 경로용도
@master/css-svelte-addonSvelte CLI가 사용하는 기본 애드온.

Svelte CLI로 이 애드온을 실행하세요. 설정은 SvelteKit이 없는 프로젝트를 거부하고 실행 단계는 Svelte 의존성이 필요합니다. 전체 설정은 Svelte 설치를 참고하세요.

소스와 README · 공개 내보내기 매핑

@master/eslint-config-css

공식 flat config 프리셋으로 ESLint의 Master CSS lint 규칙을 활성화합니다. 기본 내보내기와 recommended는 같은 설정을 가리킵니다.

가져오기 경로용도
@master/eslint-config-css권장 ESLint flat config.

ESLint flat config에 프리셋을 추가하세요. 프로젝트별 동작은 플러그인 설정으로 조정하며 코드 린트는 각 규칙을 설명합니다.

@master/css/sort-classeswarn예

생성 규칙 순서와 다른 클래스 및 중복.

@master/css/no-invalid-classeserror아니요

잘못된 Master CSS 구문과 생성 CSS. 일치하지 않는 클래스는 disallowUnknownClass일 때만 보고.

@master/css/no-conflicting-classeswarn예

같은 변형 범위의 전체 및 부분 선언 충돌. 전체 재정의만 수정.

@master/css/prefer-canonical-classeswarn예

토큰 동일성과 생성 규칙 동작을 유지할 때만 비표준 형식을 보고.

@master/css/no-unapproved-raw-values와 @master/css/prefer-component-classes는 프리셋에 없습니다.

소스와 README · 공개 내보내기 매핑

@master/eslint-plugin-css

ESLint 플러그인은 JavaScript와 템플릿 구문을 Master CSS 검증, 클래스 정렬, 수정에 연결합니다. 기본 내보내기와 masterCSS는 같은 플러그인을 제공합니다.

가져오기 경로용도
@master/eslint-plugin-css플러그인 규칙과 권장 설정.

표준 규칙에는 공식 프리셋을 쓰거나 자신의 flat config에 플러그인을 등록하세요. 규칙 동작은 코드 린트를 참고하세요.

설정은 @master/css 설정 키 아래에 있으며 배열은 기본값을 대체합니다.

설정기본값용도
classAttributes['class', 'className']클래스 문자열을 포함한 마크업 속성.
classFunctionsclsx, cva, ctl, cv, class, classnames, classVariant, styled, classList.add/remove/toggle/replace인수에 클래스 문자열을 포함할 수 있는 호출 대상과 태그 템플릿. styled는 styled.button 같은 멤버 형식도 허용.
classDeclarations[]클래스 선언으로 취급할 프로젝트 변수나 객체 속성.
ignoredKeys['compoundVariants', 'defaultVariants']변형 설정 객체를 순회할 때 건너뛸 객체 키.

@master/css/no-unapproved-raw-values는 토큰 지원 유틸리티의 원시 값을 보고합니다. requireProperties는 나열한 네이티브 속성으로 제한하며 비어 있거나 생략하면 모든 토큰 지원 속성을 검사합니다. allowProperties와 allowedPatterns는 예외를 추가하고 allowRawValues는 규칙을 비활성화합니다. 네이티브 사용자 지정 속성 참조는 유효합니다. 진단 data는 속성 범위와 표준 토큰 계열을 명시하며 자동 수정은 없습니다.

@master/css/prefer-component-classes는 최상위 _, >, +, ~ 결합자로 다른 요소를 스타일하는 클래스가 max개(기본 3)를 초과하는 클래스 목록을 보고합니다. 진단 data는 classNames와 targets를 나열하며 자동 수정은 없습니다.

소스와 README · 공개 내보내기 매핑

@master/css-language-server

Language Server Protocol로 Master CSS 완성, 호버, 색상, 포맷, 시맨틱 토큰을 제공합니다. 라이브러리 진입점은 호스트 관리 수명주기를 지원하고 server 진입점은 프로세스를 시작합니다.

가져오기 경로용도
@master/css-language-server언어 서버, 작업공간 설정, 시맨틱 토큰 요청 이름.
@master/css-language-server/server실행 가능한 서버 시작 진입점. 명명 내보내기나 기본 내보내기가 없습니다.

호스트에 포함할 때 MasterCSSLanguageServer를 만들고 시작한 뒤 종료 시 해제하세요. /server 진입점을 불러오면 서버를 즉시 만들고 시작합니다. 편집기 흐름은 언어 서비스를 참고하세요.

소스와 README · 공개 내보내기 매핑

@master/css-language-service

Master CSS 도구 결과를 편집기 문서, 언어 기능, 구문 강조에 매핑합니다. 서버 렌더링 코드 표시에는 Shiki 진입점을 사용하세요.

가져오기 경로용도
@master/css-language-service편집기 문서 서비스, 설정, 트리거 문자.
@master/css-language-service/common공유 완성 트리거 문자.
@master/css-language-service/shikiShiki 변환기, 시맨틱 장식, 언어 등록.
@master/css-language-service/shiki.cssShiki 출력의 호버 활성 마크업 클래스 색상.
@master/css-language-service/syntaxes/master-css.tmLanguage.json지시문 강조용 TextMate 문법 에셋.

MasterCSSLanguageService를 만들 때 도구 세션을 제공하세요. Shiki 헬퍼는 옵션으로 재사용 가능한 언어 세션이나 manifest를 받습니다. @master/css-language-service/shiki.css를 가져오면 호버 시 마크업 강조를 활성화합니다. 설정과 예제는 언어 서비스를 참고하세요.

소스와 README · 공개 내보내기 매핑

@master/css-mcp

Master CSS Model Context Protocol 서버를 만들거나 stdio 전송을 시작합니다. 도구 목록은 작업과 파일 영향을 설명합니다.

가져오기 경로용도
@master/css-mcp서버 팩토리와 stdio 시작.

호스트가 전송 설정을 담당하면 createMasterCSSMCPServer()를, stdio는 startMasterCSSMCPStdioServer()를 사용합니다. 클라이언트 등록은 MCP 서버, 사용법은 도구 목록을 참고하고 전체 규칙은 tools/list로 읽으세요.

소스와 README · 공개 내보내기 매핑

@master/css-next

Master CSS를 Next.js 설정과 빌드 출력에 연결합니다. 루트 내보내기는 Next 설정을 감싸고 adapter 진입점은 빌드 통합과 어댑터 합성을 지원합니다.

가져오기 경로용도
@master/css-nextNext 설정 래퍼와 통합 옵션.
@master/css-next/adapter빌드 어댑터, 합성 헬퍼, 렌더링 출력 보고서.

Next 설정에 루트 기본 내보내기를 사용하세요. 빌드 출력을 처리하는 렌더링 모드는 래퍼를 await해야 합니다. 설정과 지원 모드는 Next.js 설치를 참고하세요.

소스와 README · 공개 내보내기 매핑

@master/css-nuxt

Master CSS를 Nuxt 모듈로 등록합니다. 기본 내보내기와 masterCSSNuxtModule은 같은 모듈입니다.

가져오기 경로용도
@master/css-nuxtNuxt 모듈.

Nuxt 설정에서 모듈을 등록하여 프레임워크가 설정과 수명주기를 관리하게 하세요. Nuxt 설치를 참고하세요.

소스와 README · 공개 내보내기 매핑

@master/css-preset

프리셋은 테마 토큰, 조건, 유틸리티, 컴파일한 기본 manifest를 제공합니다. CSS 가져오기와 JSON manifest는 서로 다른 사용처를 위한 것입니다.

가져오기 경로용도
@master/css-preset전체 프리셋 스타일시트 진입점.
@master/css-preset/default-manifest.json엔진, 컴파일러, 도구 API용 컴파일한 기본 manifest.
@master/css-preset/index.css전체 프리셋 스타일시트 진입점.
@master/css-preset/base.css기본 스타일과 안정적인 캐스케이드 레이어 순서.
@master/css-preset/theme.css프리셋 테마 정의.
@master/css-preset/media.css프리셋 뷰포트 및 사용자 환경 설정 조건.
@master/css-preset/container.css프리셋 컨테이너 너비 조건.
@master/css-preset/utilities.css프리셋 유틸리티 등록.

스타일시트를 작성할 때는 CSS를 가져오고 기본 manifest를 실행하거나 그에 대해 컴파일하는 API에는 JSON manifest를 전달하세요. 작성과 재정의는 테마 토큰에 설명되어 있습니다.

소스와 README · 공개 내보내기 매핑

@master/css-runtime

문서나 섀도 루트의 클래스를 관찰하고 생성 CSS를 유지합니다. 런타임 시작에는 프로젝트 manifest를 브라우저 엔진용으로 컴파일한 런타임 프로그램이 필요하며 소유 세션을 반환합니다.

가져오기 경로용도
@master/css-runtime런타임 시작, 관찰, 스냅샷, 사용자 정의 요소 통합.
@master/css-runtime/default-programMaster CSS 빌드 통합이 없는 앱을 위해 런타임 프로그램으로 컴파일한 기본 프리셋.

세션 사용 전에 MasterCSSRuntime.start()를 await하고 소유자가 완료되면 dispose()를 호출하세요. withMasterCSSRuntime()은 시작과 해제를 사용자 정의 요소 연결 콜백에 통합하며 섀도 루트가 필요합니다. 브라우저 흐름은 렌더링 모드를 참고하세요.

공식 통합은 시작 코드를 주입합니다. 사용자 정의 진입점은 program에 () => import('virtual:master-css-program').then(module => module.default) 같은 로더와 emittedGlobals를 전달한 뒤 observe()를 호출합니다. 런타임 전용 페이지는 시작 시 프로그램을 불러옵니다. 유효한 hydrationManifest가 있는 점진적 페이지는 engine: 'eager'나 enginePrefetch: 'idle'이 없으면 범위 밖 클래스가 나타날 때까지 엔진을 지연합니다. emittedGlobals는 번들을 쓰는 모든 페이지에 적용됩니다. 런타임은 생성 규칙과 온디맨드 키프레임을 자체 스타일시트에 삽입하고 연결된 스타일시트에는 쓰지 않습니다.

snapshot()은 연결된 DOM 사용인 usageCounts와 사전 준비, 하이드레이션, 유지 규칙도 가질 수 있는 classRules를 구분합니다. engine은 'deferred', 'loading', 'ready', 'failed'입니다. 지연 엔진이 시작하기 전 클래스 스냅샷에는 규칙 항목이 없고 layers도 비어 있습니다. ensureClassRules()와 deleteClassRules()는 DOM 사용과 독립적이며 삭제는 동기적이고 유지 정책을 우회합니다. 엔진 준비 전에는 RUNTIME_ENGINE_NOT_READY를 던지고 시작하므로 먼저 ready()를 await하세요.

소스와 README · 공개 내보내기 매핑

@master/css-schema

공유 타입과 코덱은 manifest, 진단, 하이드레이션, 통합 옵션을 설명하며 호스트가 구조화한 Master CSS 데이터를 교환하게 합니다.

가져오기 경로용도
@master/css-schema공통 manifest, 진단, 렌더링 모드 내보내기.
@master/css-schema/manifestManifest v6 타입, 변수 헬퍼, 직렬화.
@master/css-schema/hydration-manifest하이드레이션 규칙, 리소스 순서, 직렬화 헬퍼.
@master/css-schema/css-directives지시문 결과, 소스 범위, 출력 매핑.
@master/css-schema/css-syntax유틸리티, 선택자, 값 표현 타입.
@master/css-schema/utility-type유틸리티 분류 상수와 타입.
@master/css-schema/runtime-style런타임 스타일 요소 식별자.
@master/css-schema/emitted-globals세션 밖에서 이미 출력한 리소스 수.
@master/css-schema/css-common공유 CSS 공급업체 식별자.
@master/css-schema/diagnostics진단 버전, 소스 범위, 오류 페이로드.
@master/css-schema/integration렌더링 모드와 공유 통합 옵션.

타입을 소유한 좁은 하위 경로에서 가져오세요. 타입 선언은 데이터 형태를 설명하며 임의 입력을 검증하거나 스타일시트 지시문을 컴파일하지 않습니다. API 간 manifest와 진단을 전달할 때 버전 필드를 유지하세요. 수동 편집으로 manifest가 호환되지는 않습니다.

serializeMasterCSSManifest()로 manifest를 저장합니다. 직렬화는 파생 필드를 정규화하지만 엔진 검증을 대체하거나 주석과 편집 가능한 CSS 서식을 보존하지 않습니다. 알 수 없는 필드는 확장 메커니즘이 아닙니다. 바깥 구조가 이를 유지해도 중첩 필드가 허용되거나 실행 가능해지지는 않습니다.

소스와 README · 공개 내보내기 매핑

@master/css-server

생성 CSS를 HTML에 렌더링하고 브라우저 하이드레이션 데이터를 만듭니다. 호스트 수명주기에 맞춰 일회성 헬퍼, 재사용 렌더러, 스트리밍 HTML 세션을 선택하세요.

가져오기 경로용도
@master/css-serverHTML 렌더링, 스트리밍 세션, 하이드레이션 옵션.

렌더링 전에 컴파일한 manifest를 제공하세요. emitted-global과 하이드레이션 메타데이터를 클라이언트에 전달한 CSS와 맞추고 재사용 세션은 사용 후 해제하세요. 전체 HTML 예제는 렌더링 모드를 참고하세요.

createServerRenderer()는 렌더링 간 규칙을 캐시합니다. manifest가 바뀌면 다시 만들고 장기 실행 서버에서는 maxCachedClasses를 제한하세요. 사용자 정의 호스트는 페이지가 연결할 수 있는 최종 stylesheets를 @master/css-compiler/stylesheet의 describeLinkedStylesheet()가 반환하는 { href, css, imports }와 이를 해석할 documentURL로 전달할 수 있습니다. 해당 스타일시트가 이미 전달하는 테마 변수와 네이티브 키프레임은 style#master-css에 반복하지 않습니다. 렌더링은 서로 다른 레이어나 조건의 같은 이름 정의도 포함해 각 키프레임 정의를 독립적으로 추적합니다.

소스와 README · 공개 내보내기 매핑

@master/css-svelte

Master CSS를 Svelte 빌드와 SvelteKit 서버 응답에 통합합니다. 빌드와 요청 처리는 별도 진입점을 사용합니다.

가져오기 경로용도
@master/css-svelte/viteSvelte 지원 Vite 플러그인과 옵션.
@master/css-svelte/hooks.server명명된 SvelteKit 요청 처리기.

빌드 설정에 Vite 플러그인을 등록하고 SvelteKit 서버 훅에 명명된 handle 내보내기를 등록하세요. 전체 연결은 Svelte 설치를 참고하세요.

소스와 README · 공개 내보내기 매핑

@master/css-tooling

클래스 구문 분석, 후보 추출, 규칙 검증과 lint 또는 언어 결과를 제공합니다. 집중된 진입점을 선택하거나 여러 작업에 도구 세션을 재사용하세요.

가져오기 경로용도
@master/css-tooling여러 분석 기능을 아우르는 재사용 비동기 도구 세션.
@master/css-tooling/node동기 네이티브 세션과 네이티브 선언 지원.
@master/css-tooling/lexer클래스 목록과 CSS 소스 분석.
@master/css-tooling/lexer/node동기 네이티브 클래스 목록 분석.
@master/css-tooling/source소스 후보 추출과 소스 범위 타입.
@master/css-tooling/source/node동기 네이티브 소스 추출.
@master/css-tooling/scanner/node파일시스템 스캐너, 유지 후보, 스캐너 수명주기.
@master/css-tooling/validator제공한 manifest에 대한 클래스 검증.
@master/css-tooling/validator/node동기 네이티브 클래스 검증.
@master/css-tooling/lintLint 진단, 편집, 표준 형식 제안, 콘텐츠 헬퍼.
@master/css-tooling/lint/node동기 네이티브 클래스 lint.
@master/css-tooling/language편집기 독립 분석, 완성, 색상, 시맨틱 토큰.
@master/css-tooling/language/node동기 네이티브 언어 세션과 분석.

세션을 만들거나 의미 분석 헬퍼를 호출할 때 프로젝트 manifest를 제공하세요. 반복 분석에는 세션을 재사용하고 완료 후 해제합니다. Node 하위 경로는 동기 네이티브 작업을 제공하며 파일시스템 스캔은 별도의 비동기 수명주기를 가집니다.

소스와 README · 공개 내보내기 매핑

@master/css-vite

Vite에 Master CSS를 등록하여 프로젝트 스타일을 컴파일하고 선택 렌더링 모드를 조정합니다. 기본 내보내기와 createMasterCSSVitePlugin은 같은 팩토리입니다.

가져오기 경로용도
@master/css-viteVite 플러그인 팩토리와 옵션.

Vite 설정에서 팩토리를 호출하고 반환된 플러그인 수명주기는 Vite가 관리하게 하세요. 스타일시트 진입점과 모드 설정은 Vite 설치를 참고하세요.

소스와 README · 공개 내보내기 매핑

@master/css-webpack

Webpack에 Master CSS를 등록합니다. 기본 내보내기와 MasterCSSWebpackPlugin은 플러그인 클래스를 제공하며 옵션은 렌더링과 스캐너 동작을 선택합니다.

가져오기 경로용도
@master/css-webpackWebpack 플러그인 클래스와 옵션.

Webpack 설정에서 플러그인을 생성하여 Webpack이 컴파일 훅을 제어하게 하세요. 스타일시트와 loader 설정은 Webpack 설치를 참고하세요.

소스와 README · 공개 내보내기 매핑