@simplysm/sd-cli 14.0.11 → 14.0.13

package/src/utils/vite-config.ts

@@ -1,6 +1,5 @@
 import type { InlineConfig, PluginOption } from "vite";
 import path from "path";
-import { pathx } from "@simplysm/core-node";
 import tsconfigPaths from "vite-tsconfig-paths";
 import browserslistToEsbuild from "browserslist-to-esbuild";
 import { sdAngularPlugin } from "../angular/vite-angular-plugin.js";
@@ -36,7 +35,7 @@ export interface CreateClientViteConfigOptions {
     warnings?: string[];
     lint?: { success: boolean; errorCount: number; warningCount: number; formattedOutput: string };
   }) => void;
-  /** Enable lint using ts.Program from compilation */
+  /** 컴파일의 ts.Program을 사용하여 lint 실행 */
   enableLint?: boolean;
   /** replaceDeps 목록 (dev 모드에서 sdScopeWatchPlugin에 전달) */
   replaceDeps?: ScopeWatchReplaceDep[];
@@ -48,18 +47,25 @@ export interface CreateClientViteConfigOptions {
   postCssPlugins?: unknown[];
   /** polyfills 경로 배열 (transformIndexHtml로 주입) */
   polyfills?: string[];
-  /** legacy module support (disables code splitting + replaces import.meta) */
+  /** 레거시 모듈 지원 (코드 스플리팅 비활성화) */
   legacyModule?: boolean;
   /** PWA 설정. false로 비활성화. 미설정 시 기본값으로 활성화 */
   pwa?: false | SdPwaConfig;
+  /** Vite optimizeDeps.exclude에 전달할 패키지 목록 */
+  exclude?: string[];
+  /** watch 모드 (build.watch 활성화, emptyOutDir: false) */
+  watch?: boolean;
+  /** 빌드 출력 경로 (미설정 시 pkgDir/dist) */
+  outDir?: string;
+  /** Vite base 경로 (미설정 시 /{pkgName}/) */
+  base?: string;
 }
 
 /**
  * Client Vite 설정을 생성한다. dev/build 모드에서 공용으로 사용한다.
  *
- * Feature 3.1 범위: sdAngularPlugin, tsconfigPaths, env define, server/build 기본 설정
- * Feature 5.1: browserslist, PostCSS, polyfills
- * Feature 1.1: legacyModule (import.meta 치환 + inlineDynamicImports)
+ * Angular AOT 플러그인, tsconfigPaths, env define, server/build 기본 설정,
+ * browserslist, PostCSS, polyfills, legacyModule (inlineDynamicImports) 등을 통합 구성한다.
  */
 export async function createClientViteConfig(
   options: CreateClientViteConfigOptions,
@@ -97,6 +103,7 @@ export async function createClientViteConfig(
     sdAngularPlugin({
       tsconfig: options.tsconfigPath,
       dev: options.mode === "dev",
+      sourcemap: options.mode === "dev" || options.watch === true,
       onBuildStart: options.onBuildStart,
       onBuild: options.onBuild,
       enableLint: options.enableLint,
@@ -112,8 +119,12 @@ export async function createClientViteConfig(
     );
   }
 
-  // replaceDeps HMR (dev 모드만)
-  if (options.mode === "dev" && options.replaceDeps != null && options.replaceDeps.length > 0) {
+  // replaceDeps HMR (dev 모드 또는 watch 모드)
+  if (
+    (options.mode === "dev" || options.watch === true) &&
+    options.replaceDeps != null &&
+    options.replaceDeps.length > 0
+  ) {
     plugins.push(
       sdScopeWatchPlugin({
         pkgDir: options.pkgDir,
@@ -127,7 +138,7 @@ export async function createClientViteConfig(
   const serverConfig =
     options.mode === "dev"
       ? {
-          host: options.serverPort === 0 ? "127.0.0.1" : undefined,
+          host: options.serverPort === 0 ? "127.0.0.1" : "0.0.0.0",
           port: options.serverPort === 0 ? undefined : options.serverPort,
           strictPort: options.serverPort !== 0,
         }
@@ -139,9 +150,15 @@ export async function createClientViteConfig(
       ? { postcss: { plugins: options.postCssPlugins as import("postcss").AcceptedPlugin[] } }
       : undefined;
 
+  // optimizeDeps.exclude (사용자 지정 exclude)
+  const optimizeDepsConfig =
+    options.exclude != null && options.exclude.length > 0
+      ? { exclude: options.exclude }
+      : undefined;
+
   const config: InlineConfig = {
     root: options.pkgDir,
-    base: `/${name}/`,
+    base: options.base ?? `/${name}/`,
     define: Object.keys(define).length > 0 ? define : undefined,
     plugins,
     server: serverConfig,
@@ -149,6 +166,15 @@ export async function createClientViteConfig(
     esbuild: {
       target: esbuildTarget,
     },
+    build: {
+      target: esbuildTarget,
+    },
+    optimizeDeps: {
+      ...optimizeDepsConfig,
+      esbuildOptions: {
+        target: esbuildTarget as string[],
+      },
+    },
   };
 
   // PWA (build 모드 + pwa !== false)
@@ -189,26 +215,59 @@ export async function createClientViteConfig(
     );
   }
 
-  // polyfills plugin (transformIndexHtml)
+  // polyfills plugin
   if (options.polyfills != null && options.polyfills.length > 0) {
     const polyfillImports = options.polyfills;
-    (config.plugins as PluginOption[]).push({
-      name: "sd-polyfills",
-      transformIndexHtml() {
-        return [
-          {
-            tag: "script",
-            attrs: { type: "module" },
-            children: polyfillImports.map((p) => `import "${p}";`).join("\n"),
-            injectTo: "head-prepend" as const,
-          },
-        ];
-      },
-    });
+    if (options.legacyModule === true) {
+      // legacyModule: 메인 엔트리의 transform에서 polyfill import를 상단에 주입한다.
+      // transformIndexHtml의 인라인 <script type="module">은 Vite 빌드에서 번들링되지 않으므로,
+      // Rollup이 처리할 수 있도록 소스 코드 레벨에서 주입한다.
+      const mainEntryPath = path.resolve(options.pkgDir, "src/main.ts");
+      (config.plugins as PluginOption[]).push({
+        name: "sd-polyfills",
+        transform(code, id) {
+          if (path.normalize(id) !== path.normalize(mainEntryPath)) return null;
+          // polyfillImports는 pkgDir 기준 상대경로 (예: "./src/polyfills.ts")
+          // main.ts는 src/ 안에 있으므로, main.ts 기준 상대경로로 변환한다
+          const mainDir = path.dirname(mainEntryPath);
+          const polyfillCode = polyfillImports
+            .map((p) => {
+              const abs = path.resolve(options.pkgDir, p);
+              this.addWatchFile(abs);
+              const rel = path.relative(mainDir, abs);
+              const posixRel = rel.replace(/\\/g, "/");
+              return "import \"./" + posixRel + "\";";
+            })
+            .join("\n");
+          return { code: polyfillCode + "\n" + code, map: null };
+        },
+      });
+    } else {
+      // dev 모드: transformIndexHtml로 인라인 스크립트 주입 (Vite dev server가 처리)
+      (config.plugins as PluginOption[]).push({
+        name: "sd-polyfills",
+        transformIndexHtml() {
+          return [
+            {
+              tag: "script",
+              attrs: { type: "module" },
+              children: polyfillImports.map((p) => `import "${p}";`).join("\n"),
+              injectTo: "head-prepend" as const,
+            },
+          ];
+        },
+      });
+    }
   }
 
-  // legacyModule: true → 단일 번들 + import.meta 치환
+  // legacyModule: true → 코드 스플리팅 비활성화 + esbuild import.meta 변환 + 잔여 import() 제거
   if (options.legacyModule === true) {
+    config.esbuild = {
+      ...config.esbuild,
+      supported: {
+        "import-meta": false,
+      },
+    };
     config.build = {
       ...config.build,
       rollupOptions: {
@@ -218,38 +277,41 @@ export async function createClientViteConfig(
       },
     };
 
-    const pkgDir = options.pkgDir;
-    const base = `/${name}/`;
-
+    // Rollup이 인라인하지 못한 잔여 dynamic import()를 제거한다.
+    // inlineDynamicImports가 정적 경로를 모두 인라인한 후에도,
+    // @vite-ignore나 런타임 계산 경로의 import()가 남을 수 있다.
+    // Chrome 61은 import() 구문을 파싱하지 못하므로 no-op 함수로 치환한다.
     (config.plugins as PluginOption[]).push({
-      name: "sd-legacy-import-meta",
+      name: "sd-legacy-strip-dynamic-import",
       enforce: "post",
-      transform(code: string, id: string) {
-        if (!code.includes("import.meta")) return;
-
-        // id(파일 경로)를 Vite 서빙 URL로 변환
-        const relative = pathx.posix(path.relative(pkgDir, id));
-        const moduleUrl = id.startsWith("/") || id.startsWith("\0")
-          ? id // 가상 모듈(/@vite/client 등)은 그대로 사용
-          : base + relative;
-
-        const varName = "__sd_import_meta__";
-        const injected = `const ${varName} = { url: new URL(${JSON.stringify(moduleUrl)}, document.baseURI).href };\n`;
-        const replaced = code.replaceAll("import.meta", varName);
-
-        return { code: injected + replaced, map: null };
+      renderChunk(code) {
+        if (!code.includes("import(")) return null;
+        return {
+          code: code.replace(
+            /\bimport\s*\(/g,
+            "(function(){return Promise.reject(new Error(\"Dynamic import not supported\"))})(",
+          ),
+          map: null,
+        };
       },
     });
   }
 
   // build 모드 설정
   if (options.mode === "build") {
-    config.logLevel = "silent";
     config.build = {
       ...config.build,
-      outDir: path.join(options.pkgDir, "dist"),
-      emptyOutDir: true,
+      outDir: options.outDir ?? path.join(options.pkgDir, "dist"),
     };
+    if (options.watch === true) {
+      config.build.watch = {};
+      config.build.emptyOutDir = false;
+      config.build.minify = false;
+      config.build.sourcemap = true;
+    } else {
+      config.logLevel = "silent";
+      config.build.emptyOutDir = true;
+    }
   }
 
   return config;

package/src/utils/vite-scope-watch-plugin.ts

@@ -44,7 +44,12 @@ export function sdScopeWatchPlugin(options: SdScopeWatchPluginOptions): Plugin {
 
       const watchPaths: string[] = [];
       for (const dep of options.replaceDeps) {
-        const distDir = path.join(dep.sourcePath, "dist");
+        const distDir = path.join(
+          options.pkgDir,
+          "node_modules",
+          ...dep.packageName.split("/"),
+          "dist",
+        );
         if (fs.existsSync(distDir)) {
           watchPaths.push(distDir);
         }

package/src/utils/worker-events.ts

@@ -6,24 +6,24 @@ import { formatBuildMessages } from "./output-utils";
 
 const workerEventsLogger = consola.withTag("sd:cli:worker-events");
 
-/** Worker build completion event data */
+/** 워커 빌드 완료 이벤트 데이터 */
 export interface BuildEventData {
   success: boolean;
   errors?: string[];
   warnings?: string[];
 }
 
-/** Worker error event data */
+/** 워커 에러 이벤트 데이터 */
 export interface ErrorEventData {
   message: string;
 }
 
-/** Worker server ready event data */
+/** 워커 서버 준비 완료 이벤트 데이터 */
 export interface ServerReadyEventData {
   port: number;
 }
 
-/** Server Build completion event data */
+/** Server 빌드 완료 이벤트 데이터 */
 export interface ServerBuildEventData {
   success: boolean;
   mainJsPath: string;
@@ -32,7 +32,7 @@ export interface ServerBuildEventData {
 }
 
 /**
- * Base Worker info type
+ * 기본 Worker 정보 타입
  */
 export interface BaseWorkerInfo<TEvents extends Record<string, unknown> = Record<string, unknown>> {
   name: string;
@@ -46,7 +46,7 @@ export interface BaseWorkerInfo<TEvents extends Record<string, unknown> = Record
 }
 
 /**
- * Worker event handler options
+ * 워커 이벤트 핸들러 옵션
  */
 export interface WorkerEventHandlerOptions {
   resultKey: string;
@@ -55,13 +55,13 @@ export interface WorkerEventHandlerOptions {
 }
 
 /**
- * Register common Worker event handlers (buildStart, build, error only - serverReady not included)
+ * 공통 Worker 이벤트 핸들러를 등록한다 (buildStart, build, error만 — serverReady 미포함)
  *
- * @param workerInfo Worker info
- * @param opts Handler options
- * @param results Result map
- * @param rebuildManager Rebuild manager
- * @returns completeTask function (saves result and signals build completion)
+ * @param workerInfo 워커 정보
+ * @param opts 핸들러 옵션
+ * @param results 결과 맵
+ * @param rebuildManager 재빌드 매니저
+ * @returns completeTask 함수 (결과 저장 및 빌드 완료 신호)
  */
 export function registerWorkerEventHandlers(
   workerInfo: {
@@ -85,18 +85,18 @@ export function registerWorkerEventHandlers(
     workerInfo.isInitialBuild = false;
   };
 
-  // Build start (on rebuild)
+  // 빌드 시작 (재빌드 시)
   workerInfo.worker.on("buildStart", () => {
     if (!workerInfo.isInitialBuild) {
       workerInfo.buildResolver = rebuildManager.registerBuild(opts.resultKey, opts.listrTitle);
     }
   });
 
-  // Build completion
+  // 빌드 완료
   workerInfo.worker.on("build", (data) => {
     workerEventsLogger.debug(`[${workerInfo.name}] build: success=${String(data.success)}`);
 
-    // Print warnings
+    // 경고 출력
     if (data.warnings != null && data.warnings.length > 0) {
       workerEventsLogger.warn(
         formatBuildMessages(workerInfo.name, workerInfo.config.target, data.warnings),
@@ -112,7 +112,7 @@ export function registerWorkerEventHandlers(
     });
   });
 
-  // Error
+  // 에러
   workerInfo.worker.on("error", (data) => {
     workerEventsLogger.debug(`[${workerInfo.name}] error: ${data.message}`);
     completeTask({

package/src/utils/worker-utils.ts

@@ -2,11 +2,11 @@ import consola, { type ConsolaInstance, LogLevels } from "consola";
 import { SdCliReporter } from "./SdCliReporter";
 
 /**
- * Apply sd-cli reporter and debug log level in worker threads
+ * 워커 스레드에서 sd-cli 리포터와 디버그 로그 레벨을 적용한다.
  *
- * Checks the SD_DEBUG environment variable (set by --debug flag in main process)
- * and applies debug log level to consola in the current worker thread.
- * Must be called at worker module top level.
+ * SD_DEBUG 환경변수(메인 프로세스의 --debug 플래그로 설정)를 확인하고
+ * 현재 워커 스레드의 consola에 디버그 로그 레벨을 적용한다.
+ * 워커 모듈 최상위에서 호출해야 한다.
  */
 export function applyDebugLevel(): void {
   consola.options.reporters = [new SdCliReporter()];
@@ -16,14 +16,13 @@ export function applyDebugLevel(): void {
 }
 
 /**
- * Register cleanup handlers for worker process shutdown signals
+ * 워커 프로세스 종료 시그널에 대한 정리 핸들러를 등록한다.
  *
- * Registers SIGINT and SIGTERM handlers to gracefully cleanup resources
- * before process exit. Both handlers execute the cleanup function and
- * exit with code 0.
+ * 프로세스 종료 전 리소스를 정상적으로 정리하기 위해 SIGINT와 SIGTERM 핸들러를 등록한다.
+ * 두 핸들러 모두 정리 함수를 실행하고 코드 0으로 종료한다.
  *
- * @param cleanup - Cleanup function to execute on shutdown (sync or async)
- * @param logger - Consola logger instance for error logging
+ * @param cleanup - 종료 시 실행할 정리 함수 (동기 또는 비동기)
+ * @param logger - 에러 로깅용 consola 로거 인스턴스
  */
 export function registerCleanupHandlers(
   cleanup: () => void | Promise<void>,
@@ -45,10 +44,10 @@ export function registerCleanupHandlers(
 }
 
 /**
- * Create guard to prevent duplicate calls to Worker function
+ * Worker 함수의 중복 호출을 방지하는 가드를 생성한다.
  *
- * @param label - Function name to use in error message
- * @returns Guard function that throws error if called twice
+ * @param label - 에러 메시지에 사용할 함수명
+ * @returns 두 번 호출되면 에러를 던지는 가드 함수
  */
 export function createOnceGuard(label: string): () => void {
   let called = false;

package/src/vitest-plugin.ts

@@ -1,6 +1,7 @@
 import type { Plugin } from "vite";
 import path from "path";
 import ts from "typescript";
+import { pathx } from "@simplysm/core-node";
 import { NgtscProgram, type AngularLibraryHostExtensions } from "./utils/angular-build";
 import { compileScssString, compileScssFile } from "./utils/scss-compiler";
 
@@ -48,7 +49,7 @@ export function angularVitestPlugin(options: AngularVitestPluginOptions): Plugin
 
       const host = ts.createCompilerHost(compilerOptions);
 
-      // AngularLibraryHostExtensions duck-typing
+      // AngularLibraryHostExtensions 덕 타이핑
       const hostExt = host as ts.CompilerHost & AngularLibraryHostExtensions;
       hostExt.readResource = (fileName: string) => ts.sys.readFile(fileName) ?? "";
 
@@ -95,12 +96,12 @@ export function angularVitestPlugin(options: AngularVitestPluginOptions): Plugin
       const { transformers } = program.compiler.prepareEmit();
       const tsProgram = program.getTsProgram();
 
-      // per-file emit
+      // 파일별 emit
       for (const filePath of sourceFiles) {
         const sf = tsProgram.getSourceFile(filePath);
         if (sf == null) continue;
 
-        currentSourcePath = normalizePath(filePath);
+        currentSourcePath = pathx.posix(filePath);
         tsProgram.emit(sf, host.writeFile, undefined, false, transformers);
       }
     },
@@ -110,7 +111,7 @@ export function angularVitestPlugin(options: AngularVitestPluginOptions): Plugin
         return undefined;
       }
 
-      const compiled = compiledFiles.get(normalizePath(id));
+      const compiled = compiledFiles.get(pathx.posix(id));
       if (compiled == null) {
         return undefined;
       }
@@ -119,7 +120,3 @@ export function angularVitestPlugin(options: AngularVitestPluginOptions): Plugin
     },
   };
 }
-
-function normalizePath(p: string): string {
-  return p.replace(/\\/g, "/");
-}