@simplysm/sd-cli 14.0.38 → 14.0.40

package/dist/workers/server-esbuild-context.js

@@ -1,14 +1,27 @@
 import esbuild from "esbuild";
+import { err as errNs } from "@simplysm/core-common";
 import { createServerEsbuildOptions, writeChangedOutputFiles, } from "../esbuild/esbuild-config.js";
+import { createTscPlugin } from "../esbuild/esbuild-tsc-plugin.js";
 /** esbuild watch context (모듈 스코프 상태) */
 let context;
 /** 마지막 빌드의 metafile (변경 필터링용) */
 let lastMetafile;
+/** tsc 플러그인 인스턴스 (모듈 스코프 상태) */
+let tscPlugin;
 /**
  * esbuild watch context를 생성한다.
  * dev 모드 전용 (metafile:true, write:false).
  */
 export async function createContext(options) {
+    if (options.tsc != null) {
+        tscPlugin = createTscPlugin({
+            pkgDir: options.pkgDir,
+            cwd: options.tsc.cwd,
+            output: options.tsc.output,
+            env: options.tsc.env,
+            includeTests: options.tsc.includeTests,
+        });
+    }
     const baseOptions = createServerEsbuildOptions({
         pkgDir: options.pkgDir,
         entryPoints: options.entryPoints,
@@ -18,6 +31,7 @@ export async function createContext(options) {
     });
     context = await esbuild.context({
         ...baseOptions,
+        plugins: tscPlugin != null ? [tscPlugin.plugin] : [],
         metafile: true,
         write: false,
     });
@@ -29,18 +43,32 @@ export async function createContext(options) {
 export async function rebuild() {
     if (context == null)
         return null;
-    const result = await context.rebuild();
+    let result;
+    try {
+        result = await context.rebuild();
+    }
+    catch (err) {
+        const tscErrors = tscPlugin?.getErrors() ?? [];
+        const allErrors = [errNs.message(err), ...tscErrors];
+        return {
+            success: false,
+            errors: allErrors.length > 0 ? allErrors : undefined,
+            warnings: undefined,
+        };
+    }
     if (result.metafile != null) {
         lastMetafile = result.metafile;
     }
     if (result.outputFiles) {
         await writeChangedOutputFiles(result.outputFiles);
     }
-    const errors = result.errors.map((e) => e.text);
+    const esbuildErrors = result.errors.map((e) => e.text);
+    const tscErrors = tscPlugin?.getErrors() ?? [];
+    const allErrors = [...esbuildErrors, ...tscErrors];
     const warnings = result.warnings.map((w) => w.text);
     return {
-        success: result.errors.length === 0,
-        errors: errors.length > 0 ? errors : undefined,
+        success: allErrors.length === 0,
+        errors: allErrors.length > 0 ? allErrors : undefined,
         warnings: warnings.length > 0 ? warnings : undefined,
     };
 }
@@ -57,6 +85,9 @@ export async function recreateContext(options) {
     const oldContext = context;
     context = undefined;
     lastMetafile = undefined;
+    if (tscPlugin != null) {
+        tscPlugin.resetBuilderProgram();
+    }
     try {
         await createContext(options);
     }
@@ -73,6 +104,7 @@ export async function dispose() {
     const contextToDispose = context;
     context = undefined;
     lastMetafile = undefined;
+    tscPlugin = undefined;
     if (contextToDispose != null) {
         await contextToDispose.dispose();
     }
@@ -89,4 +121,25 @@ export function getMetafile() {
 export function hasContext() {
     return context != null;
 }
+/**
+ * tsc 플러그인의 ts.Program을 반환한다.
+ * 플러그인이 없으면 undefined를 반환한다.
+ */
+export function getTscProgram() {
+    return tscPlugin?.getProgram();
+}
+/**
+ * tsc 플러그인의 affected files를 반환한다.
+ * 플러그인이 없으면 undefined를 반환한다.
+ */
+export function getTscAffectedFiles() {
+    return tscPlugin?.getAffectedFiles();
+}
+/**
+ * tsc 플러그인의 diagnostics를 반환한다.
+ * 플러그인이 없으면 빈 배열을 반환한다.
+ */
+export function getTscDiagnostics() {
+    return tscPlugin?.getDiagnostics() ?? [];
+}
 //# sourceMappingURL=server-esbuild-context.js.map

package/dist/workers/server-esbuild-context.js.map

@@ -1 +1 @@
-{"version":3,"file":"server-esbuild-context.js","sourceRoot":"","sources":["../../src/workers/server-esbuild-context.ts"],"names":[],"mappings":"AAAA,OAAO,OAAO,MAAM,SAAS,CAAC;AAC9B,OAAO,EACL,0BAA0B,EAC1B,uBAAuB,GACxB,MAAM,2BAA2B,CAAC;AAYnC,wCAAwC;AACxC,IAAI,OAAyC,CAAC;AAE9C,iCAAiC;AACjC,IAAI,YAA0C,CAAC;AAE/C;;;GAGG;AACH,MAAM,CAAC,KAAK,UAAU,aAAa,CAAC,OAA8B;IAChE,MAAM,WAAW,GAAG,0BAA0B,CAAC;QAC7C,MAAM,EAAE,OAAO,CAAC,MAAM;QACtB,WAAW,EAAE,OAAO,CAAC,WAAW;QAChC,GAAG,EAAE,OAAO,CAAC,GAAG;QAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ;QAC1B,GAAG,EAAE,IAAI;KACV,CAAC,CAAC;IAEH,OAAO,GAAG,MAAM,OAAO,CAAC,OAAO,CAAC;QAC9B,GAAG,WAAW;QACd,QAAQ,EAAE,IAAI;QACd,KAAK,EAAE,KAAK;KACb,CAAC,CAAC;AACL,CAAC;AAED;;;GAGG;AACH,MAAM,CAAC,KAAK,UAAU,OAAO;IAK3B,IAAI,OAAO,IAAI,IAAI;QAAE,OAAO,IAAI,CAAC;IAEjC,MAAM,MAAM,GAAG,MAAM,OAAO,CAAC,OAAO,EAAE,CAAC;IAEvC,IAAI,MAAM,CAAC,QAAQ,IAAI,IAAI,EAAE,CAAC;QAC5B,YAAY,GAAG,MAAM,CAAC,QAAQ,CAAC;IACjC,CAAC;IAED,IAAI,MAAM,CAAC,WAAW,EAAE,CAAC;QACvB,MAAM,uBAAuB,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;IACpD,CAAC;IAED,MAAM,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IAChD,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IAEpD,OAAO;QACL,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,MAAM,KAAK,CAAC;QACnC,MAAM,EAAE,MAAM,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;QAC9C,QAAQ,EAAE,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;KACrD,CAAC;AACJ,CAAC;AAED;;;;;;;;GAQG;AACH,MAAM,CAAC,KAAK,UAAU,eAAe,CAAC,OAA8B;IAClE,MAAM,UAAU,GAAG,OAAO,CAAC;IAC3B,OAAO,GAAG,SAAS,CAAC;IACpB,YAAY,GAAG,SAAS,CAAC;IAEzB,IAAI,CAAC;QACH,MAAM,aAAa,CAAC,OAAO,CAAC,CAAC;IAC/B,CAAC;YAAS,CAAC;QACT,IAAI,UAAU,IAAI,IAAI,EAAE,CAAC;YACvB,MAAM,UAAU,CAAC,OAAO,EAAE,CAAC;QAC7B,CAAC;IACH,CAAC;AACH,CAAC;AAED;;GAEG;AACH,MAAM,CAAC,KAAK,UAAU,OAAO;IAC3B,MAAM,gBAAgB,GAAG,OAAO,CAAC;IACjC,OAAO,GAAG,SAAS,CAAC;IACpB,YAAY,GAAG,SAAS,CAAC;IAEzB,IAAI,gBAAgB,IAAI,IAAI,EAAE,CAAC;QAC7B,MAAM,gBAAgB,CAAC,OAAO,EAAE,CAAC;IACnC,CAAC;AACH,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,WAAW;IACzB,OAAO,YAAY,CAAC;AACtB,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,UAAU;IACxB,OAAO,OAAO,IAAI,IAAI,CAAC;AACzB,CAAC"}
+{"version":3,"file":"server-esbuild-context.js","sourceRoot":"","sources":["../../src/workers/server-esbuild-context.ts"],"names":[],"mappings":"AACA,OAAO,OAAO,MAAM,SAAS,CAAC;AAC9B,OAAO,EAAE,GAAG,IAAI,KAAK,EAAE,MAAM,uBAAuB,CAAC;AACrD,OAAO,EACL,0BAA0B,EAC1B,uBAAuB,GACxB,MAAM,2BAA2B,CAAC;AACnC,OAAO,EAAE,eAAe,EAAwB,MAAM,+BAA+B,CAAC;AAqBtF,wCAAwC;AACxC,IAAI,OAAyC,CAAC;AAE9C,iCAAiC;AACjC,IAAI,YAA0C,CAAC;AAE/C,gCAAgC;AAChC,IAAI,SAAsC,CAAC;AAE3C;;;GAGG;AACH,MAAM,CAAC,KAAK,UAAU,aAAa,CAAC,OAA8B;IAChE,IAAI,OAAO,CAAC,GAAG,IAAI,IAAI,EAAE,CAAC;QACxB,SAAS,GAAG,eAAe,CAAC;YAC1B,MAAM,EAAE,OAAO,CAAC,MAAM;YACtB,GAAG,EAAE,OAAO,CAAC,GAAG,CAAC,GAAG;YACpB,MAAM,EAAE,OAAO,CAAC,GAAG,CAAC,MAAM;YAC1B,GAAG,EAAE,OAAO,CAAC,GAAG,CAAC,GAAG;YACpB,YAAY,EAAE,OAAO,CAAC,GAAG,CAAC,YAAY;SACvC,CAAC,CAAC;IACL,CAAC;IAED,MAAM,WAAW,GAAG,0BAA0B,CAAC;QAC7C,MAAM,EAAE,OAAO,CAAC,MAAM;QACtB,WAAW,EAAE,OAAO,CAAC,WAAW;QAChC,GAAG,EAAE,OAAO,CAAC,GAAG;QAChB,QAAQ,EAAE,OAAO,CAAC,QAAQ;QAC1B,GAAG,EAAE,IAAI;KACV,CAAC,CAAC;IAEH,OAAO,GAAG,MAAM,OAAO,CAAC,OAAO,CAAC;QAC9B,GAAG,WAAW;QACd,OAAO,EAAE,SAAS,IAAI,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,EAAE;QACpD,QAAQ,EAAE,IAAI;QACd,KAAK,EAAE,KAAK;KACb,CAAC,CAAC;AACL,CAAC;AAED;;;GAGG;AACH,MAAM,CAAC,KAAK,UAAU,OAAO;IAK3B,IAAI,OAAO,IAAI,IAAI;QAAE,OAAO,IAAI,CAAC;IAEjC,IAAI,MAA2B,CAAC;IAChC,IAAI,CAAC;QACH,MAAM,GAAG,MAAM,OAAO,CAAC,OAAO,EAAE,CAAC;IACnC,CAAC;IAAC,OAAO,GAAG,EAAE,CAAC;QACb,MAAM,SAAS,GAAG,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;QAC/C,MAAM,SAAS,GAAG,CAAC,KAAK,CAAC,OAAO,CAAC,GAAG,CAAC,EAAE,GAAG,SAAS,CAAC,CAAC;QACrD,OAAO;YACL,OAAO,EAAE,KAAK;YACd,MAAM,EAAE,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;YACpD,QAAQ,EAAE,SAAS;SACpB,CAAC;IACJ,CAAC;IAED,IAAI,MAAM,CAAC,QAAQ,IAAI,IAAI,EAAE,CAAC;QAC5B,YAAY,GAAG,MAAM,CAAC,QAAQ,CAAC;IACjC,CAAC;IAED,IAAI,MAAM,CAAC,WAAW,EAAE,CAAC;QACvB,MAAM,uBAAuB,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;IACpD,CAAC;IAED,MAAM,aAAa,GAAG,MAAM,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IACvD,MAAM,SAAS,GAAG,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IAC/C,MAAM,SAAS,GAAG,CAAC,GAAG,aAAa,EAAE,GAAG,SAAS,CAAC,CAAC;IACnD,MAAM,QAAQ,GAAG,MAAM,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;IAEpD,OAAO;QACL,OAAO,EAAE,SAAS,CAAC,MAAM,KAAK,CAAC;QAC/B,MAAM,EAAE,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,SAAS;QACpD,QAAQ,EAAE,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS;KACrD,CAAC;AACJ,CAAC;AAED;;;;;;;;GAQG;AACH,MAAM,CAAC,KAAK,UAAU,eAAe,CAAC,OAA8B;IAClE,MAAM,UAAU,GAAG,OAAO,CAAC;IAC3B,OAAO,GAAG,SAAS,CAAC;IACpB,YAAY,GAAG,SAAS,CAAC;IAEzB,IAAI,SAAS,IAAI,IAAI,EAAE,CAAC;QACtB,SAAS,CAAC,mBAAmB,EAAE,CAAC;IAClC,CAAC;IAED,IAAI,CAAC;QACH,MAAM,aAAa,CAAC,OAAO,CAAC,CAAC;IAC/B,CAAC;YAAS,CAAC;QACT,IAAI,UAAU,IAAI,IAAI,EAAE,CAAC;YACvB,MAAM,UAAU,CAAC,OAAO,EAAE,CAAC;QAC7B,CAAC;IACH,CAAC;AACH,CAAC;AAED;;GAEG;AACH,MAAM,CAAC,KAAK,UAAU,OAAO;IAC3B,MAAM,gBAAgB,GAAG,OAAO,CAAC;IACjC,OAAO,GAAG,SAAS,CAAC;IACpB,YAAY,GAAG,SAAS,CAAC;IACzB,SAAS,GAAG,SAAS,CAAC;IAEtB,IAAI,gBAAgB,IAAI,IAAI,EAAE,CAAC;QAC7B,MAAM,gBAAgB,CAAC,OAAO,EAAE,CAAC;IACnC,CAAC;AACH,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,WAAW;IACzB,OAAO,YAAY,CAAC;AACtB,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,UAAU;IACxB,OAAO,OAAO,IAAI,IAAI,CAAC;AACzB,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,aAAa;IAC3B,OAAO,SAAS,EAAE,UAAU,EAAE,CAAC;AACjC,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,mBAAmB;IACjC,OAAO,SAAS,EAAE,gBAAgB,EAAE,CAAC;AACvC,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,iBAAiB;IAC/B,OAAO,SAAS,EAAE,cAAc,EAAE,IAAI,EAAE,CAAC;AAC3C,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@simplysm/sd-cli",
-  "version": "14.0.38",
+  "version": "14.0.40",
   "description": "Simplysm package - CLI tool",
   "author": "simplysm",
   "license": "Apache-2.0",
@@ -19,6 +19,8 @@
   ],
   "sideEffects": false,
   "dependencies": {
+    "acorn": "^8.14.1",
+    "acorn-walk": "^8.3.4",
     "@angular/build": "^21.2.7",
     "@angular/compiler-cli": "^21.2.8",
     "@fastify/http-proxy": "^11.4.3",
@@ -38,9 +40,9 @@
     "typescript": "^5.9.3",
     "ws": "^8.20.0",
     "yargs": "^18.0.0",
-    "@simplysm/core-common": "14.0.38",
-    "@simplysm/core-node": "14.0.38",
-    "@simplysm/storage": "14.0.38"
+    "@simplysm/storage": "14.0.40",
+    "@simplysm/core-common": "14.0.40",
+    "@simplysm/core-node": "14.0.40"
   },
   "devDependencies": {
     "@types/semver": "^7.7.1",

package/src/angular/angular-build-pipeline.ts

@@ -65,7 +65,7 @@ export interface AngularBuildPipelineOptions {
   compilerOptionsTransformer?: (opts: ts.CompilerOptions) => ts.CompilerOptions;
 
   // client 모드 전용
-  postCssPlugins?: unknown[];
+  postcssPlugins?: unknown[];
   scssCacheDir?: string;
 }
 
@@ -210,7 +210,7 @@ export class AngularBuildPipeline {
         this._options.mode === "client"
           ? createClientTransformStylesheet({
               loadPaths,
-              postCssPlugins: this._options.postCssPlugins,
+              postcssPlugins: this._options.postcssPlugins,
               scssErrors: this._scssErrors,
               scssDependencies: this._scssDependencies,
               cacheDir: this._options.scssCacheDir,

package/src/angular/client-transform-stylesheet.ts

@@ -6,7 +6,7 @@ import { compileScssFileAsync, compileScssStringAsync } from "./scss-compiler.js
 
 export interface ClientTransformStylesheetOptions {
   loadPaths: string[];
-  postCssPlugins?: unknown[];
+  postcssPlugins?: unknown[];
   scssErrors: string[];
   scssDependencies: Map<string, Set<string>>;
   /** SCSS 캐시 디렉토리 (미지정 시 캐시 비활성화) */
@@ -57,11 +57,11 @@ async function readFileHash(filePath: string): Promise<string | undefined> {
 export function createClientTransformStylesheet(
   options: ClientTransformStylesheetOptions,
 ): (data: string, containingFile: string, stylesheetFile?: string) => Promise<string | null> {
-  const { loadPaths, postCssPlugins, scssErrors, scssDependencies, cacheDir } = options;
+  const { loadPaths, postcssPlugins, scssErrors, scssDependencies, cacheDir } = options;
 
   const postCssProcessor =
-    postCssPlugins != null && postCssPlugins.length > 0
-      ? postcss(postCssPlugins as postcss.AcceptedPlugin[])
+    postcssPlugins != null && postcssPlugins.length > 0
+      ? postcss(postcssPlugins as postcss.AcceptedPlugin[])
       : undefined;
 
   return async (

package/src/dev-server/hmr-client-script.ts

@@ -3,14 +3,14 @@
  * Chrome 61+ 호환 문법으로 작성 (optional chaining, nullish coalescing 미사용).
  * @param basePath basePath (예: "/app/")
  */
-export function getHmrClientScript(_basePath: string): string {
+export function getHmrClientScript(_basePath: string, port: number): string {
   return [
     "(function() {",
     "  var ws = null;",
     "  var reconnectDelay = 1000;",
     "",
     "  function connect() {",
-    '    ws = new WebSocket("ws://" + location.hostname + ":" + location.port);',
+    `    ws = new WebSocket("ws://" + location.hostname + ":${port}");`,
     "",
     "    ws.onmessage = function(e) {",
     "      var msg = JSON.parse(e.data);",
@@ -60,8 +60,8 @@ export function getHmrClientScript(_basePath: string): string {
  * Feature 1.2의 GenerateIndexHtmlOptions.postTransform에 전달하여 사용.
  * @param basePath basePath (예: "/app/")
  */
-export function createHmrPostTransform(basePath: string): (content: string) => Promise<string> {
-  const script = getHmrClientScript(basePath);
+export function createHmrPostTransform(basePath: string, port: number): (content: string) => Promise<string> {
+  const script = getHmrClientScript(basePath, port);
   const scriptTag = `<script>${script}</script>`;
 
   return (html: string): Promise<string> => {

package/src/esbuild/esbuild-client-config.ts

@@ -1,7 +1,9 @@
 import path from "path";
 import fs from "fs";
+import { createRequire } from "module";
 import esbuild from "esbuild";
 import browserslistToEsbuild from "browserslist-to-esbuild";
+import type { AcceptedPlugin } from "postcss";
 import {
   createCompilerPlugin,
   SourceFileCache,
@@ -9,6 +11,7 @@ import {
   type BundleStylesheetOptions,
 } from "@angular/build/private";
 import { createScssPlugin } from "./esbuild-scss-plugin";
+import { createPostcssPlugin } from "./esbuild-postcss-plugin";
 
 export interface CreateClientEsbuildOptions {
   /** 패키지 디렉토리 경로 */
@@ -29,8 +32,6 @@ export interface CreateClientEsbuildOptions {
   onEnd?: (result: esbuild.BuildResult) => void | Promise<void>;
   /** PostCSS 플러그인 ([name, options] 튜플 배열) */
   postcssPlugins?: [string, (object | string)?][];
-  /** PostCSS 설정 기준 경로 */
-  postcssConfigPath?: string;
   /** 빌드 출력 경로 (기본: pkgDir/dist) */
   outdir?: string;
   /** browserslist 쿼리. 미설정 시 "es2022" 기본값 */
@@ -91,18 +92,23 @@ export async function createClientEsbuildContext(
       path: cachePath,
       basePath: cachePath,
     },
-    postcssConfiguration:
-      options.postcssPlugins != null
-        ? {
-            config: { plugins: options.postcssPlugins },
-            configPath: options.postcssConfigPath ?? options.pkgDir,
-          }
-        : undefined,
+    postcssConfiguration: undefined,
     inlineStyleLanguage: "scss",
   };
 
   const angularPlugin = createCompilerPlugin(pluginOptions, styleOptions);
 
+  // PostCSS 플러그인 로딩 (튜플 → 인스턴스)
+  let loadedPostcssPlugins: AcceptedPlugin[] | undefined;
+  if (options.postcssPlugins != null && options.postcssPlugins.length > 0) {
+    const req = createRequire(path.join(options.pkgDir, "package.json"));
+    loadedPostcssPlugins = options.postcssPlugins.map(([name, pluginOpts]) => {
+      const pluginFn = req(name);
+      const fn = pluginFn.default ?? pluginFn;
+      return pluginOpts != null ? fn(pluginOpts) : fn;
+    });
+  }
+
   // SCSS side-effect import 처리 플러그인
   const scssPlugin = createScssPlugin({
     loadPaths: [
@@ -126,10 +132,10 @@ export async function createClientEsbuildContext(
   }
 
   // 커스텀 env
+  // esbuild define은 정적 패턴만 치환하므로, import.meta.env 객체 자체를 주입해야
+  // env() 함수의 동적 접근(import.meta.env?.[key])이 동작한다.
   if (options.env != null) {
-    for (const [key, value] of Object.entries(options.env)) {
-      define[`import.meta.env.${key}`] = JSON.stringify(value);
-    }
+    define["import.meta.env"] = JSON.stringify(options.env);
   }
 
   // import.meta.hot 폴리필 banner (Angular HMR 런타임용)
@@ -184,9 +190,12 @@ export async function createClientEsbuildContext(
             },
           ]
         : []),
+      ...(options.plugins ?? []),
       angularPlugin,
       scssPlugin,
-      ...(options.plugins ?? []),
+      ...(loadedPostcssPlugins != null
+        ? [createPostcssPlugin({ plugins: loadedPostcssPlugins })]
+        : []),
       ...(options.legacyModule === true
         ? [
             {

package/src/esbuild/esbuild-postcss-plugin.ts

@@ -0,0 +1,117 @@
+import type esbuild from "esbuild";
+import type { AcceptedPlugin } from "postcss";
+import postcss from "postcss";
+import fs from "fs";
+import * as acorn from "acorn";
+import * as walk from "acorn-walk";
+
+export interface CreatePostcssPluginOptions {
+  /** 이미 로딩된 PostCSS 플러그인 인스턴스 배열 */
+  plugins: AcceptedPlugin[];
+}
+
+export function createPostcssPlugin(options: CreatePostcssPluginOptions): esbuild.Plugin {
+  return {
+    name: "sd-postcss",
+    setup(build) {
+      build.onEnd(async (result) => {
+        if (options.plugins.length === 0) return;
+        if (result.metafile == null) return;
+
+        const processor = postcss(options.plugins);
+        const outputFiles = Object.keys(result.metafile.outputs);
+
+        // .css 파일 처리
+        for (const file of outputFiles) {
+          if (!file.endsWith(".css")) continue;
+
+          try {
+            const css = await fs.promises.readFile(file, "utf-8");
+            const processed = await processor.process(css, { from: file });
+            await fs.promises.writeFile(file, processed.css);
+          } catch (e: unknown) {
+            result.errors.push({
+              id: "",
+              pluginName: "sd-postcss",
+              text: `PostCSS error in ${file}: ${e instanceof Error ? e.message : String(e)}`,
+              location: null,
+              notes: [],
+              detail: undefined,
+            });
+          }
+        }
+
+        // .js 파일 처리 — ɵɵdefineComponent 내 styles 배열의 문자열에 PostCSS 적용
+        for (const file of outputFiles) {
+          if (!file.endsWith(".js")) continue;
+
+          try {
+            const code = await fs.promises.readFile(file, "utf-8");
+            if (!code.includes("styles")) continue;
+
+            const ast = acorn.parse(code, {
+              ecmaVersion: "latest",
+              sourceType: "module",
+            });
+
+            // styles 배열 내 문자열 리터럴의 위치와 PostCSS 결과를 수집
+            const replacements: Array<{ start: number; end: number; text: string }> = [];
+
+            walk.ancestor(ast, {
+              Property(node: any, _state: any, ancestors: any[]) {
+                // key가 "styles"이고 value가 ArrayExpression인 Property만 대상
+                if (node.key.type !== "Identifier" || node.key.name !== "styles") return;
+                if (node.value.type !== "ArrayExpression") return;
+
+                // ancestors에서 ɵɵdefineComponent 호출을 확인
+                const inDefineComponent = ancestors.some(
+                  (a: any) =>
+                    a.type === "CallExpression" &&
+                    a.callee?.type === "MemberExpression" &&
+                    a.callee.property?.type === "Identifier" &&
+                    a.callee.property.name === "\u0275\u0275defineComponent",
+                );
+                if (!inDefineComponent) return;
+
+                for (const element of node.value.elements) {
+                  if (element == null) continue;
+                  if (element.type !== "Literal" || typeof element.value !== "string") continue;
+
+                  replacements.push({
+                    start: element.start,
+                    end: element.end,
+                    text: element.value,
+                  });
+                }
+              },
+            });
+
+            if (replacements.length === 0) continue;
+
+            // PostCSS 적용 및 역순 교체
+            let modified = code;
+            // 끝에서 시작 방향으로 교체하여 offset 유지
+            const sorted = replacements.sort((a, b) => b.start - a.start);
+
+            for (const rep of sorted) {
+              const processed = await processor.process(rep.text, { from: file });
+              const escaped = JSON.stringify(processed.css);
+              modified = modified.slice(0, rep.start) + escaped + modified.slice(rep.end);
+            }
+
+            await fs.promises.writeFile(file, modified);
+          } catch (e: unknown) {
+            result.errors.push({
+              id: "",
+              pluginName: "sd-postcss",
+              text: `PostCSS error in ${file}: ${e instanceof Error ? e.message : String(e)}`,
+              location: null,
+              notes: [],
+              detail: undefined,
+            });
+          }
+        }
+      });
+    },
+  };
+}

package/src/esbuild/esbuild-tsc-plugin.ts

@@ -0,0 +1,83 @@
+import type esbuild from "esbuild";
+import type ts from "typescript";
+import { err as errNs } from "@simplysm/core-common";
+import { parseTsconfig, type TypecheckEnv } from "../utils/tsconfig";
+import { runTscPackageBuild, type TscPackageBuildResult } from "../utils/tsc-build";
+import type { SerializedDiagnostic } from "../typecheck/typecheck-serialization";
+
+export interface TscPluginOptions {
+  pkgDir: string;
+  cwd: string;
+  output: { dts: boolean };
+  env?: TypecheckEnv;
+  includeTests?: boolean;
+}
+
+export interface TscPluginResult {
+  plugin: esbuild.Plugin;
+  getProgram(): ts.Program | undefined;
+  getAffectedFiles(): ReadonlySet<string> | undefined;
+  getDiagnostics(): SerializedDiagnostic[];
+  getErrors(): string[] | undefined;
+  resetBuilderProgram(): void;
+}
+
+export function createTscPlugin(options: TscPluginOptions): TscPluginResult {
+  // 내부 상태
+  let lastProgram: ts.Program | undefined;
+  let lastAffectedFiles: ReadonlySet<string> | undefined;
+  let lastDiagnostics: SerializedDiagnostic[] = [];
+  let lastErrors: string[] | undefined;
+  let lastBuilderProgram: ts.EmitAndSemanticDiagnosticsBuilderProgram | undefined;
+
+  // onStart에서 생성한 tsc Promise (onEnd에서 await)
+  let tscPromise: Promise<TscPackageBuildResult> | undefined;
+
+  const plugin: esbuild.Plugin = {
+    name: "sd-tsc",
+    setup(build) {
+      build.onStart(() => {
+        // microtask로 tsc 스케줄링 (await하지 않음)
+        tscPromise = Promise.resolve().then(() => {
+          const parsedConfig = parseTsconfig(options.pkgDir);
+          return runTscPackageBuild({
+            pkgDir: options.pkgDir,
+            cwd: options.cwd,
+            output: { js: false, dts: options.output.dts },
+            parsedConfig,
+            env: options.env,
+            includeTests: options.includeTests,
+            oldBuilderProgram: lastBuilderProgram,
+          });
+        });
+      });
+
+      build.onEnd(async () => {
+        try {
+          const tscResult = await tscPromise!;
+          lastProgram = tscResult.program;
+          lastAffectedFiles = tscResult.affectedFiles;
+          lastDiagnostics = tscResult.diagnostics;
+          lastErrors = tscResult.errors;
+          lastBuilderProgram = tscResult.builderProgram;
+        } catch (err) {
+          lastProgram = undefined;
+          lastAffectedFiles = undefined;
+          lastDiagnostics = [];
+          lastErrors = [errNs.message(err)];
+        }
+      });
+    },
+  };
+
+  return {
+    plugin,
+    getProgram: () => lastProgram,
+    getAffectedFiles: () => lastAffectedFiles,
+    getDiagnostics: () => lastDiagnostics,
+    getErrors: () => lastErrors,
+    resetBuilderProgram: () => {
+      lastBuilderProgram = undefined;
+    },
+  };
+}