@simplysm/sd-cli 14.0.42 → 14.0.44

package/src/angular/hmr-candidates.ts

@@ -0,0 +1,295 @@
+import ts from "typescript";
+import type { NgtscProgram } from "./angular-build.js";
+
+// NgCompiler 타입은 NgtscProgram.compiler에서 추론
+type NgCompiler = NgtscProgram["compiler"];
+
+/** HMR 분석 대상 최대 변경 파일 수 */
+export const HMR_MODIFIED_FILE_LIMIT = 32;
+
+/**
+ * HMR 지원 메타데이터 필드.
+ * template, templateUrl, styles, styleUrl, stylesUrl만 HMR 업데이트를 지원한다.
+ */
+const SUPPORTED_FIELD_NAMES = new Set([
+  "template",
+  "templateUrl",
+  "styles",
+  "styleUrl",
+  "stylesUrl",
+]);
+
+const enum MetaUpdateAnalysis {
+  Supported = 0,
+  Unsupported = 1,
+  None = 2,
+}
+
+/**
+ * 변경된 파일에서 HMR 후보 컴포넌트 클래스를 수집한다.
+ *
+ * - 템플릿/스타일 파일 변경 → 해당 파일을 사용하는 컴포넌트가 후보
+ * - 소스 파일 변경 → 인라인 템플릿/스타일만 변경된 컴포넌트가 후보
+ * - 지원 불가 변경(클래스 멤버, 비-컴포넌트 문 변경 등) → 후보 전체 무효화
+ */
+export function collectHmrCandidates(
+  modifiedFiles: Set<string>,
+  angularProgram: NgtscProgram,
+  staleSourceFiles?: Map<string, ts.SourceFile>,
+): Set<ts.ClassDeclaration> {
+  const compiler = angularProgram.compiler;
+  const candidates = new Set<ts.ClassDeclaration>();
+
+  for (const file of modifiedFiles) {
+    // 템플릿 파일 변경 → 소유 컴포넌트 추가
+    const templateFileNodes = compiler.getComponentsWithTemplateFile(file);
+    if (templateFileNodes.size > 0) {
+      for (const node of templateFileNodes) {
+        if (ts.isClassDeclaration(node)) {
+          candidates.add(node);
+        }
+      }
+      continue;
+    }
+
+    // 스타일 파일 변경 → 소유 컴포넌트 추가
+    const styleFileNodes = compiler.getComponentsWithStyleFile(file);
+    if (styleFileNodes.size > 0) {
+      for (const node of styleFileNodes) {
+        if (ts.isClassDeclaration(node)) {
+          candidates.add(node);
+        }
+      }
+      continue;
+    }
+
+    // 소스 파일 변경 → 상세 분석
+    const staleSource = staleSourceFiles?.get(file);
+    if (staleSource == null) {
+      // 알 수 없는 파일 → full rebuild
+      candidates.clear();
+      break;
+    }
+
+    const updatedSource = compiler.getCurrentProgram().getSourceFile(file);
+    if (updatedSource == null) {
+      // 더 이상 존재하지 않는 파일 → full rebuild
+      candidates.clear();
+      break;
+    }
+
+    const fileCandidates = analyzeFileUpdates(staleSource, updatedSource, compiler);
+    if (fileCandidates != null) {
+      for (const node of fileCandidates) {
+        candidates.add(node);
+      }
+    } else {
+      // 지원 불가 변경 → full rebuild
+      candidates.clear();
+      break;
+    }
+  }
+
+  return candidates;
+}
+
+/**
+ * 소스 파일의 변경사항을 분석하여 HMR 후보 컴포넌트를 반환한다.
+ * 지원 불가 변경이 있으면 null을 반환한다.
+ */
+function analyzeFileUpdates(
+  stale: ts.SourceFile,
+  updated: ts.SourceFile,
+  compiler: NgCompiler,
+): ts.ClassDeclaration[] | null {
+  if (stale.statements.length !== updated.statements.length) {
+    return null;
+  }
+
+  const candidates: ts.ClassDeclaration[] = [];
+
+  for (let i = 0; i < updated.statements.length; ++i) {
+    const updatedNode = updated.statements[i];
+    const staleNode = stale.statements[i];
+
+    if (ts.isClassDeclaration(updatedNode)) {
+      if (!ts.isClassDeclaration(staleNode)) {
+        return null;
+      }
+
+      // 클래스 이름/상속/수정자 변경 확인
+      if (updatedNode.name?.text !== staleNode.name?.text) {
+        return null;
+      }
+      if (!equalRangeText(updatedNode.heritageClauses, updated, staleNode.heritageClauses, stale)) {
+        return null;
+      }
+      const updatedModifiers = ts.getModifiers(updatedNode);
+      const staleModifiers = ts.getModifiers(staleNode);
+      if (
+        updatedModifiers?.length !== staleModifiers?.length ||
+        !updatedModifiers?.every((m) => staleModifiers?.some((sm) => m.kind === sm.kind))
+      ) {
+        return null;
+      }
+
+      // 컴포넌트 클래스 확인
+      const meta = compiler.getMeta(updatedNode);
+      if (meta?.decorator != null && (meta as unknown as Record<string, unknown>)["isComponent"] === true) {
+        const updatedDecorators = ts.getDecorators(updatedNode);
+        const staleDecorators = ts.getDecorators(staleNode);
+
+        if (staleDecorators == null || staleDecorators.length !== updatedDecorators?.length) {
+          return null;
+        }
+        if (staleDecorators.length > 1) {
+          return null;
+        }
+
+        const metaDecoratorIndex = updatedDecorators.indexOf(meta.decorator);
+
+        const updatedDecExpr = meta.decorator.expression;
+        if (
+          !ts.isCallExpression(updatedDecExpr) ||
+          updatedDecExpr.arguments.length !== 1
+        ) {
+          return null;
+        }
+
+        const staleDecExpr = staleDecorators[metaDecoratorIndex].expression;
+        if (
+          !ts.isCallExpression(staleDecExpr) ||
+          staleDecExpr.arguments.length !== 1
+        ) {
+          return null;
+        }
+
+        // 데코레이터 이름/표현식 비교
+        if (!equalRangeText(updatedDecExpr.expression, updated, staleDecExpr.expression, stale)) {
+          return null;
+        }
+
+        // 메타데이터 변경 분석
+        const analysis = analyzeMetaUpdates(staleDecExpr, stale, updatedDecExpr, updated);
+        if (analysis === MetaUpdateAnalysis.Unsupported) {
+          return null;
+        }
+
+        // 클래스 멤버 변경 확인
+        if (!equalRangeText(updatedNode.members, updated, staleNode.members, stale)) {
+          return null;
+        }
+
+        if (analysis === MetaUpdateAnalysis.Supported) {
+          candidates.push(updatedNode);
+        }
+        continue;
+      }
+    }
+
+    // 비-컴포넌트 문 변경 확인
+    if (!equalRangeText(updatedNode, updated, staleNode, stale)) {
+      return null;
+    }
+  }
+
+  return candidates;
+}
+
+/**
+ * 컴포넌트 데코레이터의 메타데이터 필드 변경을 분석한다.
+ * 지원 필드(template, styles 등)만 변경되었으면 Supported,
+ * 비지원 필드가 변경되었으면 Unsupported,
+ * 변경 없으면 None.
+ */
+function analyzeMetaUpdates(
+  staleCall: ts.CallExpression,
+  staleSource: ts.SourceFile,
+  updatedCall: ts.CallExpression,
+  updatedSource: ts.SourceFile,
+): MetaUpdateAnalysis {
+  const staleObject = staleCall.arguments[0];
+  const updatedObject = updatedCall.arguments[0];
+  let hasSupportedUpdate = false;
+
+  if (!ts.isObjectLiteralExpression(staleObject) || !ts.isObjectLiteralExpression(updatedObject)) {
+    return MetaUpdateAnalysis.Unsupported;
+  }
+
+  const supportedFields = new Map<string, ts.Expression>();
+  const unsupportedFields: ts.Expression[] = [];
+
+  for (const property of staleObject.properties) {
+    if (!ts.isPropertyAssignment(property) || ts.isComputedPropertyName(property.name)) {
+      return MetaUpdateAnalysis.Unsupported;
+    }
+    const name = (property.name as ts.Identifier).text;
+    if (SUPPORTED_FIELD_NAMES.has(name)) {
+      supportedFields.set(name, property.initializer);
+    } else {
+      unsupportedFields.push(property.initializer);
+    }
+  }
+
+  let j = 0;
+  for (const property of updatedObject.properties) {
+    if (!ts.isPropertyAssignment(property) || ts.isComputedPropertyName(property.name)) {
+      return MetaUpdateAnalysis.Unsupported;
+    }
+    const name = (property.name as ts.Identifier).text;
+    if (SUPPORTED_FIELD_NAMES.has(name)) {
+      const staleInitializer = supportedFields.get(name);
+      if (
+        staleInitializer == null ||
+        !equalRangeText(property.initializer, updatedSource, staleInitializer, staleSource)
+      ) {
+        hasSupportedUpdate = true;
+      }
+      supportedFields.delete(name);
+    } else {
+      if (!equalRangeText(property.initializer, updatedSource, unsupportedFields[j++], staleSource)) {
+        return MetaUpdateAnalysis.Unsupported;
+      }
+    }
+  }
+
+  if (j !== unsupportedFields.length) {
+    return MetaUpdateAnalysis.Unsupported;
+  }
+
+  // 남은 supported field → 제거됨 → supported update
+  hasSupportedUpdate ||= supportedFields.size > 0;
+
+  return hasSupportedUpdate ? MetaUpdateAnalysis.Supported : MetaUpdateAnalysis.None;
+}
+
+/**
+ * 두 소스 파일 범위의 텍스트를 문자 단위로 비교한다.
+ */
+function equalRangeText(
+  firstRange: ts.TextRange | ts.NodeArray<ts.Node> | undefined,
+  firstSource: ts.SourceFile,
+  secondRange: ts.TextRange | ts.NodeArray<ts.Node> | undefined,
+  secondSource: ts.SourceFile,
+): boolean {
+  if (firstRange == null || secondRange == null) {
+    return firstRange === secondRange;
+  }
+
+  const firstLength = firstRange.end - firstRange.pos;
+  const secondLength = secondRange.end - secondRange.pos;
+  if (firstLength !== secondLength) {
+    return false;
+  }
+
+  for (let i = 0; i < firstLength; ++i) {
+    if (
+      firstSource.text.charCodeAt(i + firstRange.pos) !==
+      secondSource.text.charCodeAt(i + secondRange.pos)
+    ) {
+      return false;
+    }
+  }
+
+  return true;
+}

package/src/angular/ngtsc-build-core.ts

@@ -1,102 +1,32 @@
 import path from "path";
 import fs from "fs";
-import ts from "typescript";
 import { err as errNs } from "@simplysm/core-common";
 import { consola } from "consola";
 
 const logger = consola.withTag("sd:cli:ngtsc-build");
-import type { BuildOutput } from "../engines/types";
-import type { SerializedDiagnostic } from "../typecheck/typecheck-serialization";
-import type { LintWithProgramResult } from "../lint/lint-with-program";
-import type { TypecheckEnv } from "../utils/tsconfig";
-import { compileScssFile } from "./scss-compiler";
+import { compileScssFile, compileScssString } from "./scss-compiler";
+import { createOutputPathRewriter, rewriteScssImports } from "../utils/output-path-rewriter";
 
-//#region Types
-
-export interface NgtscBuildInfo {
-  name: string;
-  cwd: string;
-  pkgDir: string;
-  output: BuildOutput;
-  /** 타입체크 환경. 설정 시 getCompilerOptionsForEnv()로 compilerOptions를 조정한다. */
-  env?: TypecheckEnv;
-  /** sd.config.ts의 replaceDeps 설정 */
-  replaceDeps?: Record<string, string>;
-}
-
-export interface NgtscBuildResult {
-  build: { success: boolean; errors?: string[]; warnings?: string[]; diagnostics: SerializedDiagnostic[] };
-  lint?: LintWithProgramResult;
-}
-
-export interface NgtscCombinedBuildEvent {
-  build: { success: boolean; errors?: string[]; warnings?: string[] };
-  lint?: LintWithProgramResult;
-}
-
-//#endregion
-
-//#region CompilerOptions helpers
-
-export function buildCompilerOptions(
-  baseOptions: ts.CompilerOptions,
-  pkgDir: string,
-  output: BuildOutput,
-): ts.CompilerOptions {
-  const needsEmit = output.js || output.dts;
-  const options: ts.CompilerOptions = {
-    ...baseOptions,
-    sourceMap: false,
-    outDir: path.join(pkgDir, "dist"),
-    incremental: true,
-    tsBuildInfoFile: path.join(
-      pkgDir,
-      ".cache",
-      needsEmit ? "ngtsc-build.tsbuildinfo" : "ngtsc-typecheck.tsbuildinfo",
-    ),
-  };
-
-  if (output.js && output.dts) {
-    options.noEmit = false;
-    options.declaration = true;
-    options.declarationMap = true;
-    options.emitDeclarationOnly = false;
-    options.declarationDir = path.join(pkgDir, "dist");
-  } else if (output.js && !output.dts) {
-    options.noEmit = false;
-    options.declaration = false;
-    options.declarationMap = false;
-    options.emitDeclarationOnly = false;
-  } else if (!output.js && output.dts) {
-    options.noEmit = false;
-    options.declaration = true;
-    options.declarationMap = true;
-    options.emitDeclarationOnly = true;
-    options.declarationDir = path.join(pkgDir, "dist");
-  } else {
-    // 둘 다 false — 타입체크만 수행
-    options.noEmit = true;
-    options.declaration = false;
-    options.declarationMap = false;
-    options.emitDeclarationOnly = false;
+/**
+ * 정방향 의존성 맵(소유파일→의존성 Set)에서 역방향 인덱스(의존성→소유파일 Set)를 구축한다.
+ */
+export function buildReverseDeps(
+  forwardDeps: ReadonlyMap<string, ReadonlySet<string>>,
+): Map<string, Set<string>> {
+  const reverse = new Map<string, Set<string>>();
+  for (const [ownerFile, deps] of forwardDeps) {
+    for (const dep of deps) {
+      let owners = reverse.get(dep);
+      if (owners == null) {
+        owners = new Set();
+        reverse.set(dep, owners);
+      }
+      owners.add(ownerFile);
+    }
   }
-
-  return options;
-}
-
-//#endregion
-
-//#region SCSS loadPaths helper
-
-export function buildScssLoadPaths(info: NgtscBuildInfo): string[] {
-  return [
-    path.join(info.pkgDir, "scss"),
-    path.join(info.cwd, "node_modules"),
-  ];
+  return reverse;
 }
 
-//#endregion
-
 export function trackDeps(
   depsMap: Map<string, Set<string>>,
   containingFile: string,
@@ -128,13 +58,64 @@ export interface SideEffectScssOptions {
   scssErrors: string[];
   scssDependencies: Map<string, Set<string>>;
   registry?: Map<string, SideEffectScssEntry>;
+  /** sourceFileName → Set<registryKey(=scssAbsPath)> 역방향 인덱스. O(1) 삭제용 */
+  registryReverseIndex?: Map<string, Set<string>>;
+  /** side-effect SCSS별 의존성 맵. compileScssFile 후 갱신. 증분 판별용 */
+  sideEffectScssDeps?: Map<string, Set<string>>;
 }
 
+//#region Library SCSS transform
+
+/**
+ * Library용 transformStylesheet 콜백 팩토리.
+ * AngularCompiler의 transformStylesheet 옵션에 주입된다.
+ *
+ * - 외부 .scss 파일: compileScssFile로 CSS 반환 + 의존성 기록
+ * - 외부 비-SCSS 파일 (.css 등): null 반환 (readResource가 처리)
+ * - 인라인 스타일: compileScssString으로 CSS 반환 + 의존성 기록
+ * - 에러 시: scssErrors에 추가, SCSS error comment 반환
+ */
+export function createLibraryTransformStylesheet(
+  loadPaths: string[],
+  scssErrors: string[],
+  scssDependencies: Map<string, Set<string>>,
+): (data: string, containingFile: string, stylesheetFile?: string) => Promise<string | null> {
+  return (
+    data: string,
+    containingFile: string,
+    stylesheetFile?: string,
+  ): Promise<string | null> => {
+    try {
+      if (stylesheetFile != null && stylesheetFile.endsWith(".scss")) {
+        const result = compileScssFile(stylesheetFile, loadPaths);
+        trackDeps(scssDependencies, containingFile, result.dependencies);
+        return Promise.resolve(result.css);
+      }
+
+      if (stylesheetFile != null) {
+        // .css 등 비-SCSS 파일 → null 반환 (readResource가 처리)
+        return Promise.resolve(null);
+      }
+
+      // 인라인 스타일 — SCSS로 컴파일
+      const result = compileScssString(data, containingFile, loadPaths);
+      trackDeps(scssDependencies, containingFile, result.dependencies);
+      return Promise.resolve(result.css);
+    } catch (err) {
+      scssErrors.push(formatScssError(err, containingFile));
+      return Promise.resolve("/* SCSS compilation error */");
+    }
+  };
+}
+
+//#endregion
+
 //#region Side-effect SCSS
 
 /**
- * 레지스트리의 모든 side-effect SCSS 항목을 CSS로 컴파일한다.
- * compileGlobalScss와 동일한 패턴 — 항상 모든 항목을 재컴파일한다.
+ * 레지스트리의 side-effect SCSS 항목을 CSS로 컴파일한다.
+ * changedScssFiles가 제공되면 영향받는 항목만 재컴파일한다 (증분 모드).
+ * changedScssFiles가 미제공이면 전체 재컴파일한다 (초기 빌드).
  * 에러 발생 시 scssErrors에 추가하고 기존 CSS 파일을 보존한다.
  */
 export function compileSideEffectScss(
@@ -142,14 +123,32 @@ export function compileSideEffectScss(
   loadPaths: string[],
   scssErrors: string[],
   scssDependencies: Map<string, Set<string>>,
+  changedScssFiles?: ReadonlySet<string>,
+  sideEffectScssDeps?: Map<string, Set<string>>,
 ): void {
   logger.debug(`side-effect SCSS 컴파일 시작 (${registry.size}개)`);
   for (const entry of registry.values()) {
+    // 증분 모드: 영향받는 항목만 재컴파일
+    if (changedScssFiles != null && sideEffectScssDeps != null) {
+      const isDirectHit = changedScssFiles.has(entry.scssAbsPath);
+      let isDepsHit = false;
+      const deps = sideEffectScssDeps.get(entry.scssAbsPath);
+      if (deps != null) {
+        for (const d of deps) {
+          if (changedScssFiles.has(d)) { isDepsHit = true; break; }
+        }
+      }
+      if (!isDirectHit && !isDepsHit) continue;
+    }
     try {
       const result = compileScssFile(entry.scssAbsPath, loadPaths);
       fs.mkdirSync(path.dirname(entry.cssAbsPath), { recursive: true });
       fs.writeFileSync(entry.cssAbsPath, result.css, "utf-8");
       trackDeps(scssDependencies, entry.sourceFileName, result.dependencies);
+      // 의존성 기록 (증분 판별용)
+      if (sideEffectScssDeps != null) {
+        sideEffectScssDeps.set(entry.scssAbsPath, new Set(result.dependencies));
+      }
     } catch (err) {
       scssErrors.push(formatScssError(err, entry.scssAbsPath));
     }
@@ -184,3 +183,105 @@ export function compileGlobalScss(
 
 //#endregion
 
+//#region writeEmitResults
+
+export interface WriteEmitResultsOptions {
+  /** 출력 대상 패키지 디렉토리 */
+  pkgDir: string;
+  /** emit 결과 필터 (src/ 하위만 등) */
+  sourceFilter?: (fileName: string) => boolean;
+  /** side-effect SCSS 옵션 */
+  scss?: SideEffectScssOptions;
+}
+
+/**
+ * emitAffectedFiles 결과를 output-path-rewriting 적용 후 파일로 쓴다.
+ * scss 옵션이 제공되면 .js 파일 내 .scss side-effect import를 처리한다:
+ * 1. import 경로를 .scss → .css로 변환
+ * 2. 참조된 SCSS 파일을 CSS로 컴파일하여 dist에 출력
+ */
+export function writeEmitResults(
+  emitResults: Iterable<{ filename: string; contents: string; sourceFileName?: string }>,
+  pkgDir: string,
+  scss?: SideEffectScssOptions,
+): void {
+  logger.debug("emit 결과 파일 쓰기 시작");
+  const rewritePath = createOutputPathRewriter(pkgDir);
+  for (const { filename, contents, sourceFileName } of emitResults) {
+    const rewrite = rewritePath(filename, contents);
+    if (rewrite == null) continue;
+    let [newPath, newContent] = rewrite;
+
+    // .js 파일 내 side-effect SCSS import 처리
+    if (scss != null && newPath.endsWith(".js")) {
+      const { text, scssImports } = rewriteScssImports(newContent);
+      newContent = text;
+
+      // 새 항목 등록 전에 이 소스 파일의 기존 레지스트리 항목 제거
+      if (scss.registry != null && sourceFileName != null) {
+        if (scss.registryReverseIndex != null) {
+          // O(1) 삭제: 역방향 인덱스 활용
+          const keys = scss.registryReverseIndex.get(sourceFileName);
+          if (keys != null) {
+            for (const key of keys) {
+              scss.registry.delete(key);
+            }
+            scss.registryReverseIndex.delete(sourceFileName);
+          }
+        } else {
+          // 폴백: O(n) 순회 삭제
+          for (const [key, entry] of scss.registry) {
+            if (entry.sourceFileName === sourceFileName) {
+              scss.registry.delete(key);
+            }
+          }
+        }
+      }
+
+      if (scssImports.length > 0 && sourceFileName != null) {
+        const sourceDir = path.dirname(sourceFileName);
+        const outputDir = path.dirname(newPath);
+
+        for (const scssImport of scssImports) {
+          const scssAbsPath = path.resolve(sourceDir, scssImport);
+          const cssFileName = scssImport.replace(/\.scss$/, ".css");
+          const cssAbsPath = path.resolve(outputDir, cssFileName);
+
+          // 레지스트리가 제공된 경우 등록 (scssAbsPath를 키로 사용하여 중복 방지)
+          if (scss.registry != null) {
+            scss.registry.set(scssAbsPath, { scssAbsPath, cssAbsPath, sourceFileName });
+            // 역방향 인덱스 갱신
+            if (scss.registryReverseIndex != null) {
+              let keys = scss.registryReverseIndex.get(sourceFileName);
+              if (keys == null) {
+                keys = new Set();
+                scss.registryReverseIndex.set(sourceFileName, keys);
+              }
+              keys.add(scssAbsPath);
+            }
+          }
+
+          try {
+            const result = compileScssFile(scssAbsPath, scss.loadPaths);
+            fs.mkdirSync(path.dirname(cssAbsPath), { recursive: true });
+            fs.writeFileSync(cssAbsPath, result.css, "utf-8");
+            trackDeps(scss.scssDependencies, sourceFileName, result.dependencies);
+            // side-effect SCSS 의존성 기록 (증분 판별용)
+            if (scss.sideEffectScssDeps != null) {
+              scss.sideEffectScssDeps.set(scssAbsPath, new Set(result.dependencies));
+            }
+          } catch (err) {
+            scss.scssErrors.push(formatScssError(err, scssAbsPath));
+          }
+        }
+      }
+    }
+
+    fs.mkdirSync(path.dirname(newPath), { recursive: true });
+    fs.writeFileSync(newPath, newContent, "utf-8");
+  }
+  logger.debug("emit 결과 파일 쓰기 완료");
+}
+
+//#endregion
+