@simplysm/sd-cli 6.0.19 → 6.0.27

package/src/builders/SdCliTypescriptBuilder.ts

@@ -0,0 +1,488 @@
+import * as ts from "typescript";
+import { INpmConfig, ISdAutoIndexConfig, ISdPackageBuildResult, ITsconfig } from "../commons";
+import { FsUtil, Logger, PathUtil, SdFsWatcher } from "@simplysm/sd-core-node";
+import { NeverEntryError } from "@simplysm/sd-core-common";
+import { EventEmitter } from "events";
+import * as path from "path";
+import { SdTsDiagnosticUtil } from "../utils/SdTsDiagnosticUtil";
+import { ESLint } from "eslint";
+import { createHash } from "crypto";
+import { SdCliIndexFileGenerator } from "../build-tools/SdCliIndexFileGenerator";
+import { ParserOptions } from "@typescript-eslint/types";
+
+export class SdCliTypescriptBuilder extends EventEmitter {
+  protected readonly _logger: Logger;
+
+  protected _parsedTsconfig: ts.ParsedCommandLine;
+  public readonly npmConfig: INpmConfig;
+
+  protected _moduleResolutionCache?: ts.ModuleResolutionCache;
+  protected _cacheCompilerHost?: ts.CompilerHost;
+  protected _program?: ts.Program;
+  protected _builder?: ts.BuilderProgram | ts.EmitAndSemanticDiagnosticsBuilderProgram;
+  protected readonly _fileCache = new Map<string, ITsBuildFileCache>();
+
+  private readonly _indexFileGenerator?: SdCliIndexFileGenerator;
+
+  private _watcher?: SdFsWatcher;
+
+  public ignoreProcesses: string[];
+
+  public constructor(public rootPath: string,
+                     public tsconfigFilePath: string,
+                     ignoreProcesses: ("emit" | "check" | "lint" | "genIndex")[],
+                     public autoIndexConfig: ISdAutoIndexConfig | undefined) {
+    super();
+    this.ignoreProcesses = ignoreProcesses;
+
+    const tsconfig: ITsconfig = FsUtil.readJson(this.tsconfigFilePath);
+    this._parsedTsconfig = ts.parseJsonConfigFileContent(tsconfig, ts.sys, this.rootPath);
+
+    this.npmConfig = FsUtil.readJson(path.resolve(this.rootPath, "package.json"));
+    this._logger = Logger.get(["simplysm", "sd-cli", this.constructor.name, this.npmConfig.name]);
+
+    if (this.autoIndexConfig) {
+      this._indexFileGenerator = new SdCliIndexFileGenerator(this.rootPath, this.autoIndexConfig);
+    }
+  }
+
+  public on(event: "change", listener: () => void): this;
+  public on(event: "complete", listener: (results: ISdPackageBuildResult[]) => void): this;
+  public on(event: string | symbol, listener: (...args: any[]) => void): this {
+    return super.on(event, listener);
+  }
+
+  public async buildAsync(watch: boolean): Promise<void> {
+    this.emit("change");
+
+    // DIST 비우기
+    await FsUtil.removeAsync(this._parsedTsconfig.options.outDir!);
+    if (this._parsedTsconfig.options.declarationDir !== undefined) {
+      await FsUtil.removeAsync(this._parsedTsconfig.options.declarationDir);
+    }
+
+    // 프로그램 리로드
+    const buildResult: ISdPackageBuildResult[] = [];
+    const buildDirtyFilePaths = await this.reloadProgramAsync(watch);
+
+    // 자동생성할 소스파일들 생성 및 리로드 (index.ts등)
+    const buildGenAdditionalResult = await this.generateAdditionalFilesAsync(buildDirtyFilePaths, watch);
+    buildResult.push(...buildGenAdditionalResult.result);
+    buildDirtyFilePaths.push(...buildGenAdditionalResult.dirtyFilePaths);
+
+    // 빌드시, 빌드 수행하고 종료
+    if (!watch) {
+      const buildDoAllResults = await this.doAllAsync(buildDirtyFilePaths.distinct());
+      buildResult.push(...buildDoAllResults);
+      this.emit("complete", buildResult.distinct());
+      return;
+    }
+
+    // 변경감지용, 변경감지기 시작
+    const resultMap = new Map<string, ISdPackageBuildResult[]>();
+
+    const watchPaths = this.getWatchPaths();
+    this._watcher = new SdFsWatcher();
+    this._watcher
+      .onChange(async (changeInfos) => {
+        try {
+          // 변경파일 중, 유효한 파일 추출
+          const changedFilePaths = changeInfos
+            .map((item) => PathUtil.posix(item.filePath))
+            .filter((item) => path.basename(item).includes("."))
+            .distinct();
+          if (changedFilePaths.length === 0) return;
+
+          // 변경감지 이벤트 발생
+          this.emit("change");
+
+          // 변경파일에 대한 프로그램 리로드
+          const watchDirtyFilePaths = await this.reloadChangedProgramAsync(changedFilePaths, watch);
+          if (watchDirtyFilePaths.length === 0) {
+            this.emit("complete", Array.from(resultMap.values()).mapMany());
+            return;
+          }
+
+          // 변경파일에 대해 자동생성할 소스파일들 생성 및 리로드 (index.ts등)
+          const watchGenAdditionalResult = await this.generateAdditionalFilesAsync(watchDirtyFilePaths, watch);
+          watchDirtyFilePaths.push(...watchGenAdditionalResult.dirtyFilePaths);
+          watchDirtyFilePaths.distinctThis();
+
+          // 변경파일에 대한 빌드 및 린트
+          const watchDoAllResults = await this.doAllAsync(watchDirtyFilePaths);
+
+          // 결과 MAP에서 DIRTY FILE 삭제
+          resultMap.delete("undefined");
+          for (const dirtyFilePath of watchDirtyFilePaths) {
+            resultMap.delete(dirtyFilePath);
+          }
+
+          // 결과 MAP 구성
+          const result = [...watchGenAdditionalResult.result, ...watchDoAllResults].distinct();
+          for (const resultItem of result) {
+            const posixFilePath = resultItem.filePath !== undefined ? PathUtil.posix(resultItem.filePath) : "undefined";
+            const resultMapValue = resultMap.getOrCreate(posixFilePath, []);
+            resultMapValue.push(resultItem);
+          }
+
+          this.emit("complete", Array.from(resultMap.values()).mapMany());
+        }
+        catch (err) {
+          this.emit("complete", [{
+            filePath: undefined,
+            severity: "error",
+            message: err.stack ?? err.message
+          }]);
+        }
+      })
+      .watch(watchPaths);
+
+    // 변경감지용, 최초 빌드
+
+    // 빌드 및 린트
+    const buildDoAllResults = await this.doAllAsync(buildDirtyFilePaths.distinct());
+    buildResult.push(...buildDoAllResults);
+
+    // 결과 MAP 구성
+    buildResult.distinctThis();
+    for (const buildResultItem of buildResult) {
+      const posixFilePath = buildResultItem.filePath !== undefined ? PathUtil.posix(buildResultItem.filePath) : "undefined";
+      const resultMapValue = resultMap.getOrCreate(posixFilePath, []);
+      resultMapValue.push(buildResultItem);
+      resultMapValue.distinctThis();
+    }
+    this.emit("complete", Array.from(resultMap.values()).mapMany());
+  }
+
+  public async generateAdditionalFilesAsync(dirtyFilePaths: string[], watch: boolean): Promise<ITsGenResult> {
+    return await this._generateIndexFileAsync(watch);
+  }
+
+  protected async _generateIndexFileAsync(watch: boolean): Promise<ITsGenResult> {
+    this._logger.debug("index.ts 생성");
+
+    const result: ITsGenResult = { dirtyFilePaths: [], result: [] };
+
+    if (!this.ignoreProcesses.includes("genIndex") && this._indexFileGenerator && this.autoIndexConfig) {
+      const generateResult = await this._indexFileGenerator.generateAsync();
+      result.result.push(...generateResult.result);
+      if (generateResult.changed) {
+        result.dirtyFilePaths = await this.reloadChangedProgramAsync([this._indexFileGenerator.indexFilePath], watch);
+      }
+    }
+
+    this._logger.debug("index.ts 생성 결과", result);
+
+    return result;
+  }
+
+  protected _reloadWatchPaths(): void {
+    if (this._watcher) {
+      this._watcher.replaceWatchPaths(this.getWatchPaths());
+    }
+  }
+
+  public async doAllAsync(dirtyFilePaths: string[]): Promise<ISdPackageBuildResult[]> {
+    return (
+      await Promise.all([
+        this._runProgramAsync(dirtyFilePaths),
+        this._lintAsync(dirtyFilePaths)
+      ])
+    ).mapMany();
+  }
+
+  protected async _lintAsync(dirtyFilePaths: string[]): Promise<ISdPackageBuildResult[]> {
+    this._logger.debug("LINT");
+
+    const linter = new ESLint({
+      overrideConfig: {
+        overrides: [
+          {
+            files: ["*.ts"],
+            parserOptions: {
+              program: this._program
+            } as ParserOptions,
+            settings: {
+              "import/resolver": {
+                typescript: {
+                  project: this.tsconfigFilePath
+                }
+              }
+            }
+          }
+        ]
+      }
+    });
+
+    const filePaths = await dirtyFilePaths
+      .filterAsync(async (item) => (
+        !item.includes("node_modules")
+        && PathUtil.isChildPath(item, this.rootPath)
+        && FsUtil.exists(item)
+        && !FsUtil.isDirectory(item)
+        && !await linter.isPathIgnored(item)
+      ));
+
+    const lintResults = await linter.lintFiles(filePaths);
+
+    const result = lintResults.mapMany((report) => (
+      report.messages.map((msg) => {
+        const severity: "warning" | "error" = msg.severity === 1 ? "warning" : "error";
+
+        return {
+          filePath: report.filePath,
+          severity,
+          message: `${report.filePath}(${msg.line}, ${msg.column}): ${msg.ruleId ?? ""}: ${severity} ${msg.message}`
+        };
+      })
+    ));
+
+    this._logger.debug("LINT 결과", result);
+
+    return result;
+  }
+
+  /*protected _getAllDependencies(filePath: string): string[] {
+    this._logger.debug("파일 의존성 확인", filePath);
+
+    const sourceFile = this._builder!.getSourceFile(filePath);
+    if (!sourceFile) {
+      this._logger.debug("파일 의존성 확인 결과", []);
+      return [];
+    }
+    const result = [...this._builder!.getAllDependencies(sourceFile)];
+
+    this._logger.debug("파일 의존성 확인 결과", result);
+    return result;
+  }*/
+
+  public getWatchPaths(): string[] {
+    const builder = this._builder as ts.EmitAndSemanticDiagnosticsBuilderProgram;
+
+    const result: string[] = [];
+    for (const sourceFile of builder.getSourceFiles()) {
+      // result.push(sourceFile.fileName, ...this._getAllDependencies(sourceFile.fileName));
+      result.push(sourceFile.fileName);
+    }
+    return result.map((item) => PathUtil.posix(path.dirname(item))).filter((item) => FsUtil.exists(item)).distinct();
+  }
+
+  /*protected _getRelativeFilePaths(filePath: string): string[] {
+    const builder = this._builder as ts.EmitAndSemanticDiagnosticsBuilderProgram;
+
+    const result: string[] = [];
+    for (const sourceFile of builder.getSourceFiles()) {
+      const dependencies = this._getAllDependencies(sourceFile.fileName);
+      if (dependencies.includes(filePath)) {
+        result.push(sourceFile.fileName);
+      }
+    }
+
+    return result;
+  }*/
+
+  protected _deleteFileCaches(filePaths: string[]): void {
+    for (const filePath of filePaths) {
+      this._fileCache.delete(filePath);
+    }
+  }
+
+  // eslint-disable-next-line @typescript-eslint/require-await
+  protected async _runProgramAsync(dirtyFilePaths: string[]): Promise<ISdPackageBuildResult[]> {
+    this._logger.debug("빌드");
+
+    if (!this._builder) throw new NeverEntryError();
+
+    const diagnostics: ts.Diagnostic[] = [];
+
+    if (!this.ignoreProcesses.includes("check")) {
+      diagnostics.push(
+        ...this._builder.getOptionsDiagnostics(),
+        ...this._builder.getGlobalDiagnostics()
+      );
+
+      for (const dirtyFilePath of dirtyFilePaths) {
+        const sourceFile = this._builder.getSourceFile(dirtyFilePath);
+        if (!sourceFile) continue;
+
+        if (sourceFile.isDeclarationFile) continue;
+
+        diagnostics.push(
+          ...this._builder.getSyntacticDiagnostics(sourceFile),
+          ...this._builder.getSemanticDiagnostics(sourceFile)
+        );
+      }
+    }
+
+    if (!this.ignoreProcesses.includes("emit")) {
+      for (const dirtyFilePath of dirtyFilePaths) {
+        const sourceFile = this._builder.getSourceFile(dirtyFilePath);
+        if (!sourceFile) continue;
+        if (sourceFile.isDeclarationFile) continue;
+
+        this._builder.emit(sourceFile);
+      }
+    }
+
+    const result = diagnostics.map((item) => SdTsDiagnosticUtil.convertDiagnosticsToResult(item)).filterExists();
+
+    this._logger.debug("빌드", result);
+
+    return result;
+  }
+
+  public async reloadChangedProgramAsync(changedFilePaths: string[], watch: boolean): Promise<string[]> {
+    this._logger.debug("변경 프로그램 리로드", changedFilePaths);
+
+    // 캐시 삭제
+    // const delCachePaths = changedFilePaths.mapMany((item) => [item, ...this._getRelativeFilePaths(item)]).distinct();
+    // this._deleteFileCaches(delCachePaths);
+    this._deleteFileCaches(changedFilePaths);
+
+    // 프로그램 리로드
+    const dirtyFilePaths = await this.reloadProgramAsync(watch);
+
+    // 변경사항 있을 경우, 변경감지중이면, 변경감지 경로 리로드
+    if (dirtyFilePaths.length > 0 && watch) {
+      this._reloadWatchPaths();
+    }
+
+    dirtyFilePaths.push(...changedFilePaths.filter((key) => this._fileCache.has(key)));
+    dirtyFilePaths.distinctThis();
+
+    this._logger.debug("변경 프로그램 리로드 결과", dirtyFilePaths);
+    return dirtyFilePaths;
+  }
+
+  public async reloadProgramAsync(watch: boolean): Promise<string[]> {
+    this._logger.debug("프로그램 리로드");
+
+    this._moduleResolutionCache = ts.createModuleResolutionCache(this.rootPath, (s) => s, this._parsedTsconfig.options);
+    this._cacheCompilerHost = await this._createCacheCompilerHostAsync(this._parsedTsconfig, this._moduleResolutionCache);
+
+    this._program = ts.createProgram(
+      this._parsedTsconfig.fileNames,
+      this._parsedTsconfig.options,
+      this._cacheCompilerHost,
+      this._program
+    );
+
+    const baseGetSourceFiles = this._program.getSourceFiles;
+    this._program.getSourceFiles = function (...parameters) {
+      const files: readonly (ts.SourceFile & { version?: string })[] = baseGetSourceFiles(...parameters);
+
+      for (const file of files) {
+        if (file.version === undefined) {
+          file.version = createHash("sha256").update(file.text).digest("hex");
+        }
+      }
+
+      return files;
+    };
+
+    if (watch) {
+      const builder = ts.createEmitAndSemanticDiagnosticsBuilderProgram(
+        this._program,
+        this._cacheCompilerHost,
+        this._builder as ts.EmitAndSemanticDiagnosticsBuilderProgram
+      );
+      this._builder = builder;
+
+      const affectedFilePaths: string[] = [];
+      while (true) {
+        const result = builder.getSemanticDiagnosticsOfNextAffectedFile();
+
+        if (!result) break;
+
+        if ("fileName" in result.affected) {
+          affectedFilePaths.push(result.affected.fileName);
+        }
+      }
+
+      const result = affectedFilePaths.distinct();
+
+      this._logger.debug("프로그램 리로드 결과", result);
+
+      return result;
+    }
+    else {
+      this._builder = ts.createAbstractBuilder(this._program, this._cacheCompilerHost);
+      const result = this._builder.getSourceFiles().map((item) => item.fileName).distinct();
+
+      this._logger.debug("프로그램 리로드 결과", result);
+
+      return result;
+    }
+  }
+
+  // eslint-disable-next-line @typescript-eslint/require-await
+  protected async _createCacheCompilerHostAsync(parsedTsconfig: ts.ParsedCommandLine, moduleResolutionCache: ts.ModuleResolutionCache): Promise<ts.CompilerHost> {
+    const compilerHost = ts.createCompilerHost(parsedTsconfig.options);
+
+    const cacheCompilerHost = { ...compilerHost };
+    cacheCompilerHost.fileExists = (fileName: string) => {
+      const cache = this._fileCache.getOrCreate(PathUtil.posix(fileName), {});
+      if (cache.exists === undefined) {
+        cache.exists = compilerHost.fileExists.call(cacheCompilerHost, fileName);
+      }
+      return cache.exists;
+    };
+
+    cacheCompilerHost.getSourceFile = (fileName: string, languageVersion: ts.ScriptTarget) => {
+      const cache = this._fileCache.getOrCreate(PathUtil.posix(fileName), {});
+      if (!cache.sourceFile) {
+        cache.sourceFile = compilerHost.getSourceFile.call(cacheCompilerHost, fileName, languageVersion);
+      }
+      return cache.sourceFile;
+    };
+
+    cacheCompilerHost.writeFile = (fileName: string,
+                                   data: string,
+                                   writeByteOrderMark: boolean,
+                                   onError?: (message: string) => void,
+                                   sourceFiles?: readonly ts.SourceFile[]) => {
+      if (sourceFiles) {
+        sourceFiles.forEach((source) => {
+          const cache = this._fileCache.getOrCreate(PathUtil.posix(source.fileName), {});
+          cache.distFilePaths = (cache.distFilePaths ?? []).concat([PathUtil.posix(fileName)]).distinct();
+        });
+      }
+
+      compilerHost.writeFile.call(cacheCompilerHost, fileName, data, writeByteOrderMark, onError, sourceFiles);
+    };
+
+    cacheCompilerHost.readFile = (fileName: string) => {
+      const cache = this._fileCache.getOrCreate(PathUtil.posix(fileName), {});
+      if (cache.content === undefined) {
+        cache.content = compilerHost.readFile.call(cacheCompilerHost, fileName);
+      }
+      return cache.content;
+    };
+
+    cacheCompilerHost.resolveModuleNames = (moduleNames: string[], containingFile: string) => {
+      return moduleNames.map((moduleName) => {
+        return ts.resolveModuleName(
+          moduleName,
+          containingFile,
+          parsedTsconfig.options,
+          compilerHost,
+          moduleResolutionCache
+        ).resolvedModule;
+      });
+    };
+
+    return cacheCompilerHost;
+  }
+}
+
+export interface ITsBuildFileCache {
+  exists?: boolean;
+  sourceFile?: ts.SourceFile;
+  distFilePaths?: string[];
+  content?: string;
+}
+
+export interface ITsGenResult {
+  dirtyFilePaths: string[];
+  result: ISdPackageBuildResult[];
+}

package/src/commons.ts

@@ -20,9 +20,7 @@ export interface ISdClientPackageConfig {
   type: "client";
   env?: Record<string, string>;
   server?: string;
-  devServer?: {
-    port: number;
-  };
+  resolveFallback?: Record<string, string>;
   configs?: Record<string, any>;
   publish?: TSdPublishConfig;
 }
@@ -68,7 +66,17 @@ export interface ITsconfig {
     baseUrl?: string;
     paths?: Record<string, string[]>;
   };
+  angularCompilerOptions?: {
+    enableI18nLegacyMessageIdFormat?: boolean;
+    strictInjectionParameters?: boolean;
+    strictInputAccessModifiers?: boolean;
+    strictTemplates?: boolean;
+    strictInputTypes?: boolean;
+    strictOutputEventTypes?: boolean;
+    compilationMode?: "partial" | "full";
+  };
   files?: string[];
+  include?: string[];
 }
 
 export interface ISdPackageBuildResult {

package/src/entry-points/SdCliLocalUpdater.ts

@@ -20,25 +20,26 @@ export class SdCliLocalUpdater {
 
           const watcher = new SdFsWatcher();
           watcher
-            .on("change", async (changedInfos) => {
+            .onChange(async (changedInfos) => {
               this._logger.log("로컬 라이브러리 변경감지...");
 
               const watchPaths2 = await this._getWatchPathsAsync(updatePathInfo.source);
               watcher.replaceWatchPaths(watchPaths2);
 
-              for (const changedInfo of changedInfos) {
-                if (changedInfo.filePath.includes("node_modules") || changedInfo.filePath.endsWith("package.json")) {
+              const changedFilePaths = changedInfos.map((item) => item.filePath).distinct();
+              for (const changedFilePath of changedFilePaths) {
+                if (changedFilePath.includes("node_modules") || changedFilePath.endsWith("package.json")) {
                   continue;
                 }
 
-                const targetFilePath = path.resolve(updatePathInfo.target, path.relative(updatePathInfo.source, changedInfo.filePath));
+                const targetFilePath = path.resolve(updatePathInfo.target, path.relative(updatePathInfo.source, changedFilePath));
 
-                if (FsUtil.exists(changedInfo.filePath)) {
-                  this._logger.debug(`변경파일감지(복사): ${changedInfo.filePath}`);
-                  await FsUtil.copyAsync(changedInfo.filePath, targetFilePath);
+                if (FsUtil.exists(changedFilePath)) {
+                  this._logger.debug(`변경파일감지(복사): ${changedFilePath}`);
+                  await FsUtil.copyAsync(changedFilePath, targetFilePath);
                 }
                 else {
-                  this._logger.debug(`변경파일감지(삭제): ${changedInfo.filePath}`);
+                  this._logger.debug(`변경파일감지(삭제): ${changedFilePath}`);
                   await FsUtil.removeAsync(targetFilePath);
                 }
               }

package/src/entry-points/SdCliProject.ts

@@ -66,12 +66,13 @@ export class SdCliProject {
     for (const pkg of pkgs) {
       pkg
         .on("change", (target) => {
+          this._logger.debug(`[${pkg.npmConfig.name}${target !== undefined ? `(${target})` : ""}] 빌드를 시작합니다.`);
+
           this._fnQueue.run(() => {
             if (changeCount === 0) {
               this._logger.log(`빌드를 시작합니다...`);
             }
             changeCount++;
-            this._logger.debug(`[${pkg.npmConfig.name}${target !== undefined ? `(${target})` : ""}] 빌드를 시작합니다.`);
           });
         })
         .on("complete", (target, results) => {
@@ -83,12 +84,14 @@ export class SdCliProject {
               pkgName: pkg.npmConfig.name
             })));
 
-            changeCount--;
-            if (changeCount === 0) {
-              this._loggingResults(totalResultMap);
-              this._logger.info(`모든 빌드가 완료되었습니다.`);
-              this._loggingOpenClientHrefs();
-            }
+            setTimeout(() => {
+              changeCount--;
+              if (changeCount === 0) {
+                this._loggingResults(totalResultMap);
+                this._logger.info(`모든 빌드가 완료되었습니다.`);
+                this._loggingOpenClientHrefs();
+              }
+            }, 100);
           });
         });
 
@@ -118,10 +121,10 @@ export class SdCliProject {
 
       if (opt.watch) {
         if (pkg instanceof SdCliClientPackage) {
-          const middleware = await pkg.watchAsync();
+          const middlewares = await pkg.watchAsync();
           if (!StringUtil.isNullOrEmpty(pkg.config.server)) {
             const serverInfo = this._serverInfoMap.getOrCreate(pkg.config.server, { middlewares: [], clientNames: [] });
-            serverInfo.middlewares.push(middleware);
+            serverInfo.middlewares.push(...middlewares);
             serverInfo.clientNames = serverInfo.clientNames.concat([pkg.npmConfig.name.split("/").last()!]).distinct();
           }
         }

package/src/packages/SdCliClientPackage.ts

@@ -2,10 +2,10 @@ import { FsUtil } from "@simplysm/sd-core-node";
 import { ISdClientPackageConfig, ISdPackageBuildResult, ITsconfig } from "../commons";
 import * as path from "path";
 import { ObjectUtil } from "@simplysm/sd-core-common";
-import { SdCliNgClientBuilder } from "../build-tools/SdCliNgClientBuilder";
+import { SdCliNgClientBuilder } from "../builders/SdCliNgClientBuilder";
 import { NextHandleFunction } from "connect";
 import { SdCliPackageBase } from "./SdCliPackageBase";
-import { SdCliPublisher } from "../build-tools/SdCliPublisher";
+import { SdCliPublisher } from "../builders/SdCliPublisher";
 
 export class SdCliClientPackage extends SdCliPackageBase {
   public on(event: "change", listener: (target: "node" | "browser" | undefined) => void): this;
@@ -36,7 +36,7 @@ export class SdCliClientPackage extends SdCliPackageBase {
       .buildAsync();
   }
 
-  public async watchAsync(): Promise<NextHandleFunction> {
+  public async watchAsync(): Promise<NextHandleFunction[]> {
     await this._genBuildTsconfigAsync();
 
     const buildTsconfigFilePath = path.resolve(this.rootPath, `sd-tsconfig.json`);
@@ -78,6 +78,17 @@ export class SdCliClientPackage extends SdCliPackageBase {
     buildTsconfig.compilerOptions.declaration = false;
     delete buildTsconfig.compilerOptions.declarationDir;
 
+    buildTsconfig.compilerOptions.baseUrl = this.rootPath;
+    buildTsconfig.angularCompilerOptions = {
+      ...buildTsconfig.angularCompilerOptions ?? {},
+      enableI18nLegacyMessageIdFormat: false,
+      strictInjectionParameters: true,
+      strictInputAccessModifiers: true,
+      strictTemplates: true,
+      strictInputTypes: false,
+      strictOutputEventTypes: false
+    };
+
     const buildTsconfigFilePath = path.resolve(this.rootPath, `sd-tsconfig.json`);
     await FsUtil.writeJsonAsync(buildTsconfigFilePath, buildTsconfig, { space: 2 });
   }