@simplysm/sd-cli 7.0.37 → 7.0.38

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@simplysm/sd-cli",
-  "version": "7.0.37",
+  "version": "7.0.38",
   "description": "심플리즘 패키지 - CLI",
   "author": "김석래",
   "repository": {
@@ -43,17 +43,19 @@
     "webpack-dev-middleware": "^5.3.1",
     "webpack-hot-middleware": "^2.25.1",
     "css-loader": "^6.6.0",
-    "resource-url-loader": "^1.1.5",
-    "sass-loader": "^12.4.0"
+    "resolve-url-loader": "^5.0.0",
+    "sass-loader": "^12.4.0",
+    "connect": "^3.7.0"
   },
   "devDependencies": {
     "@types/semver": "^7.3.9",
     "@types/yargs": "^17.0.8",
-    "@types/webpack-hot-middleware": "^2.25.5"
+    "@types/webpack-hot-middleware": "^2.25.5",
+    "@types/connect": "^3.4.35"
   },
   "peerDependencies": {
-    "@simplysm/sd-core-common": "7.0.37",
-    "@simplysm/sd-core-node": "7.0.37",
-    "@simplysm/sd-service": "7.0.37"
+    "@simplysm/sd-core-common": "7.0.38",
+    "@simplysm/sd-core-node": "7.0.38",
+    "@simplysm/sd-service": "7.0.38"
   }
 }

package/src/bin/sd-cli.ts

@@ -145,6 +145,7 @@ const logger = Logger.get(["simplysm", "sd-cli", "bin", "sd-cli"]);
         confFileRelPath: argv.config ?? "simplysm.json",
         optNames: argv.options ?? []
       });
+    process.exit(0);
   }
   else if (argv._[0] === "publish") {
     await new SdCliWorkspace(process.cwd())

package/src/build-tool/SdCliNgCacheCompilerHost.ts

@@ -17,7 +17,7 @@ export class SdCliNgCacheCompilerHost {
     };
 
     cacheCompilerHost["transformResource"] = async (data, context) => {
-      if (context.resourceFile || context.type !== "style") {
+      if (context.resourceFile != null || context.type !== "style") {
         return null;
       }
 

package/src/builder/SdCliClientBuilder.ts

@@ -1,4 +1,4 @@
-import { INpmConfig, ISdCliPackageBuildResult, ISdCliServerPackageConfig } from "../commons";
+import { INpmConfig, ISdCliClientPackageConfig, ISdCliPackageBuildResult } from "../commons";
 import { EventEmitter } from "events";
 import { FsUtil, Logger, PathUtil } from "@simplysm/sd-core-node";
 import webpack from "webpack";
@@ -22,6 +22,8 @@ import { HmrLoader } from "@angular-devkit/build-angular/src/webpack/plugins/hmr
 import wdm from "webpack-dev-middleware";
 import whm from "webpack-hot-middleware";
 import { NextHandleFunction } from "connect";
+import { LicenseWebpackPlugin } from "license-webpack-plugin";
+import { Type } from "@angular-devkit/build-angular";
 
 export class SdCliClientBuilder extends EventEmitter {
   private readonly _logger = Logger.get(["simplysm", "sd-cli", this.constructor.name]);
@@ -31,7 +33,7 @@ export class SdCliClientBuilder extends EventEmitter {
   private readonly _npmConfigMap = new Map<string, INpmConfig>();
 
   public constructor(private readonly _rootPath: string,
-                     private readonly _config: ISdCliServerPackageConfig,
+                     private readonly _config: ISdCliClientPackageConfig,
                      private readonly _workspaceRootPath: string) {
     super();
 
@@ -52,7 +54,7 @@ export class SdCliClientBuilder extends EventEmitter {
     await FsUtil.removeAsync(this._parsedTsconfig.options.outDir!);
 
     // 빌드 준비
-    const webpackConfig = this._getWebpackCommonConfig(true);
+    const webpackConfig = this._getWebpackConfig(true);
     const compiler = webpack(webpackConfig);
     return await new Promise<NextHandleFunction[]>((resolve, reject) => {
       compiler.hooks.watchRun.tapAsync(this.constructor.name, (args, callback) => {
@@ -96,7 +98,7 @@ export class SdCliClientBuilder extends EventEmitter {
 
     // 빌드
     this._logger.debug("Webpack 빌드 수행...");
-    const webpackConfig = this._getWebpackCommonConfig(false);
+    const webpackConfig = this._getWebpackConfig(false);
     const compiler = webpack(webpackConfig);
     const buildResults = await new Promise<ISdCliPackageBuildResult[]>((resolve, reject) => {
       compiler.run((err, stats) => {
@@ -116,9 +118,7 @@ export class SdCliClientBuilder extends EventEmitter {
     return buildResults;
   }
 
-  private _getWebpackCommonConfig(watch: boolean): webpack.Configuration {
-    console.log(watch);
-
+  private _getWebpackConfig(watch: boolean): webpack.Configuration {
     const npmConfig = this._getNpmConfig(this._rootPath)!;
     const pkgVersion = npmConfig.version;
 
@@ -132,7 +132,100 @@ export class SdCliClientBuilder extends EventEmitter {
 
     const sassImplementation = new SassWorkerImplementation();
 
+    const mainFilePath = path.resolve(this._rootPath, "src/main.ts");
+    const polyfillsFilePath = path.resolve(this._rootPath, "src/polyfills.ts");
+    const stylesFilePath = path.resolve(this._rootPath, "src/styles.scss");
+
     return {
+      mode: watch ? "development" : "production",
+      devtool: false,
+      target: ["web", "es2015"],
+      profile: false,
+      resolve: {
+        roots: [this._rootPath],
+        extensions: [".ts", ".tsx", ".mjs", ".js"],
+        symlinks: true,
+        modules: [this._workspaceRootPath, "node_modules"],
+        mainFields: ["es2015", "browser", "module", "main"],
+        conditionNames: ["es2015", "..."]
+      },
+      resolveLoader: {
+        symlinks: true
+      },
+      context: this._workspaceRootPath,
+      entry: {
+        main: [
+          ...watch ? [
+            `webpack-hot-middleware/client?path=${publicPath}__webpack_hmr&timeout=20000&reload=true&overlay=true`,
+          ] : [],
+          mainFilePath
+        ],
+        ...FsUtil.exists(polyfillsFilePath) ? { polyfills: polyfillsFilePath } : {},
+        ...FsUtil.exists(stylesFilePath) ? { styles: stylesFilePath } : {}
+      },
+      output: {
+        uniqueName: pkgKey,
+        hashFunction: "xxhash64",
+        clean: true,
+        path: distPath,
+        publicPath,
+        filename: "[name].js",
+        chunkFilename: "[name].js",
+        libraryTarget: undefined,
+        crossOriginLoading: false,
+        trustedTypes: "angular#bundler",
+        scriptType: "module",
+      },
+      watch: false,
+      watchOptions: { poll: undefined, ignored: undefined },
+      performance: { hints: false },
+      ignoreWarnings: [
+        /Failed to parse source map from/,
+        /Add postcss as project dependency/,
+        /"@charset" must be the first rule in the file/,
+      ],
+      experiments: { backCompat: false, syncWebAssembly: true, asyncWebAssembly: true },
+      infrastructureLogging: { level: "error" },
+      stats: "errors-warnings",
+      cache: {
+        type: "filesystem",
+        profile: watch ? undefined : false,
+        cacheDirectory: path.resolve(cachePath, "angular-webpack"),
+        maxMemoryGenerations: 1,
+        name: createHash("sha1").update(pkgVersion).digest("hex")
+      },
+      node: false,
+      optimization: {
+        minimizer: [],
+        moduleIds: "deterministic",
+        chunkIds: watch ? "named" : "deterministic",
+        emitOnErrors: watch,
+        runtimeChunk: "single",
+        splitChunks: {
+          maxAsyncRequests: Infinity,
+          cacheGroups: {
+            default: {
+              chunks: "async",
+              minChunks: 2,
+              priority: 10
+            },
+            common: {
+              name: "common",
+              chunks: "async",
+              minChunks: 2,
+              enforce: true,
+              priority: 5
+            },
+            vendors: false,
+            defaultVendors: watch ? {
+              name: "vendor",
+              chunks: (chunk) => chunk.name === "main",
+              enforce: true,
+              test: /[\\/]node_modules[\\/]/
+            } : false
+          }
+        }
+      },
       plugins: [
         new NamedChunksPlugin(),
         new DedupeModuleResolvePlugin(),
@@ -144,6 +237,14 @@ export class SdCliClientBuilder extends EventEmitter {
           }
         }),*/
         new CommonJsUsageWarnPlugin(),
+        ...watch ? [] : [
+          new LicenseWebpackPlugin({
+            stats: { warnings: false, errors: false, },
+            perChunkOutput: false,
+            outputFilename: "3rdpartylicenses.txt",
+            skipChildCompilers: true
+          })
+        ],
         new CopyWebpackPlugin({
           patterns: [
             ...["favicon.ico", "assets/", "manifest.webmanifest"].map((item) => ({
@@ -165,26 +266,30 @@ export class SdCliClientBuilder extends EventEmitter {
             }))
           ]
         }),
-        new webpack.SourceMapDevToolPlugin({
-          filename: "[file].map",
-          include: [/js$/, /css$/],
-          sourceRoot: "webpack:///",
-          moduleFilenameTemplate: "[resource-path]",
-          append: undefined,
-        }),
+        ...watch ? [
+          new webpack.SourceMapDevToolPlugin({
+            filename: "[file].map",
+            include: [/js$/, /css$/],
+            sourceRoot: "webpack:///",
+            moduleFilenameTemplate: "[resource-path]",
+            append: undefined,
+          })
+        ] : [],
         new AngularWebpackPlugin({
           tsconfig: this._tsconfigFilePath,
           compilerOptions: {
-            sourceMap: true,
+            sourceMap: watch,
             declaration: false,
             declarationMap: false,
             preserveSymlinks: false
           },
           jitMode: false,
-          emitNgModuleScope: true,
+          emitNgModuleScope: watch,
           inlineStyleFileExtension: "scss"
         }),
-        new AnyComponentStyleBudgetChecker([]),
+        new AnyComponentStyleBudgetChecker(watch ? [] : [
+          { type: Type.AnyComponentStyle, maximumWarning: "2kb", maximumError: "4kb" }
+        ]),
         {
           apply: (compiler: webpack.Compiler) => {
             compiler.hooks.shutdown.tap("sass-worker", () => {
@@ -215,14 +320,16 @@ export class SdCliClientBuilder extends EventEmitter {
           },
           postTransform: undefined,
           optimization: {
-            scripts: false,
-            styles: { minify: false, inlineCritical: false },
-            fonts: { inline: false }
+            scripts: !watch,
+            styles: { minify: !watch, inlineCritical: !watch },
+            fonts: { inline: !watch }
           },
           crossOrigin: "none",
           lang: undefined
         }),
-        new webpack.HotModuleReplacementPlugin()
+        ...watch ? [
+          new webpack.HotModuleReplacementPlugin()
+        ] : []
       ] as any[],
       module: {
         strictExportPresence: true,
@@ -248,22 +355,24 @@ export class SdCliClientBuilder extends EventEmitter {
                   cacheDirectory: path.resolve(cachePath, "babel-webpack"),
                   scriptTarget: ts.ScriptTarget.ES2017,
                   aot: true,
-                  optimize: false,
+                  optimize: !watch,
                   instrumentCode: undefined
                 }
               }
             ],
           },
-          {
-            test: /\.[cm]?jsx?$/,
-            enforce: "pre",
-            loader: "source-map-loader",
-            options: {
-              filterSourceMappingUrl: (_mapUri: string, resourcePath: string) => {
-                return !resourcePath.includes("node_modules") || (/@simplysm[\\/]sd/).test(resourcePath);
+          ...watch ? [
+            {
+              test: /\.[cm]?jsx?$/,
+              enforce: "pre" as const,
+              loader: "source-map-loader",
+              options: {
+                filterSourceMappingUrl: (_mapUri: string, resourcePath: string) => {
+                  return !resourcePath.includes("node_modules") || (/@simplysm[\\/]sd/).test(resourcePath);
+                }
               }
             }
-          },
+          ] : [],
           {
             test: /\.[cm]?tsx?$/,
             loader: "@ngtools/webpack",
@@ -285,22 +394,23 @@ export class SdCliClientBuilder extends EventEmitter {
                       },
                       {
                         loader: "css-loader",
-                        options: { url: false, sourceMap: true }
+                        options: { url: false, sourceMap: watch }
                       }
                     ],
-                    include: path.resolve(this._rootPath, "src/styles.scss"),
+                    include: [stylesFilePath],
                     resourceQuery: { not: [/\?ngResource/] }
                   },
                   {
-                    type: "asset/source"
+                    type: "asset/source",
+                    resourceQuery: /\?ngResource/
                   }
                 ]
               },
               {
                 use: [
                   {
-                    loader: "resource-url-loader",
-                    options: { sourceMap: true }
+                    loader: "resolve-url-loader",
+                    options: { sourceMap: watch }
                   },
                   {
                     loader: "sass-loader",
@@ -313,7 +423,7 @@ export class SdCliClientBuilder extends EventEmitter {
                         includePaths: [],
                         outputStyle: "expanded",
                         quietDeps: true,
-                        verbose: undefined
+                        verbose: watch ? undefined : false
                       }
                     }
                   }
@@ -321,99 +431,14 @@ export class SdCliClientBuilder extends EventEmitter {
               }
             ]
           },
-          {
-            loader: HmrLoader,
-            include: [path.resolve(this._rootPath, "src/main.ts")]
-          }
-        ]
-      },
-      mode: "development",
-      devtool: false,
-      target: ["web", "es2015"],
-      profile: false,
-      resolve: {
-        roots: [this._rootPath],
-        extensions: [".ts", ".tsx", ".mjs", ".js"],
-        symlinks: true,
-        modules: [this._workspaceRootPath, "node_modules"],
-        mainFields: ["es2015", "browser", "module", "main"],
-        conditionNames: ["es2015", "..."]
-      },
-      resolveLoader: {
-        symlinks: true
-      },
-      context: this._workspaceRootPath,
-      entry: {
-        main: [
-          `webpack-hot-middleware/client?path=${publicPath}__webpack_hmr&timeout=20000&reload=true&overlay=true`,
-          path.resolve(this._rootPath, "src/main.ts")
-        ],
-        polyfills: [path.resolve(this._rootPath, "src/polyfills.ts")],
-        styles: [path.resolve(this._rootPath, "src/styles.scss")]
-      },
-      output: {
-        uniqueName: pkgKey,
-        hashFunction: "xxhash64",
-        clean: true,
-        path: distPath,
-        publicPath,
-        filename: "[name].js",
-        chunkFilename: "[name].js",
-        libraryTarget: undefined,
-        crossOriginLoading: false,
-        trustedTypes: "angular#bundler",
-        scriptType: "module",
-      },
-      watch: false,
-      watchOptions: { poll: undefined, ignored: undefined },
-      performance: { hints: false },
-      ignoreWarnings: [
-        /Failed to parse source map from/,
-        /Add postcss as project dependency/,
-        /"@charset" must be the first rule in the file/,
-      ],
-      experiments: { backCompat: false, syncWebAssembly: true, asyncWebAssembly: true },
-      infrastructureLogging: { level: "error" },
-      stats: "errors-warnings",
-      cache: {
-        type: "filesystem",
-        profile: undefined,
-        cacheDirectory: path.resolve(cachePath, "angular-webpack"),
-        maxMemoryGenerations: 1,
-        name: createHash("sha1").update(pkgVersion).digest("hex")
-      },
-      optimization: {
-        minimizer: [],
-        moduleIds: "deterministic",
-        chunkIds: "named",
-        emitOnErrors: false,
-        runtimeChunk: "single",
-        splitChunks: {
-          maxAsyncRequests: Infinity,
-          cacheGroups: {
-            default: {
-              chunks: "async",
-              minChunks: 2,
-              priority: 10
-            },
-            common: {
-              name: "common",
-              chunks: "async",
-              minChunks: 2,
-              enforce: true,
-              priority: 5
-            },
-            vendors: false,
-            defaultVendors: {
-              name: "vendor",
-              chunks: (chunk) => chunk.name === "main",
-              enforce: true,
-              test: /[\\/]node_modules[\\/]/
+          ...watch ? [
+            {
+              loader: HmrLoader,
+              include: [mainFilePath]
             }
-          }
-        }
+          ] : []
+        ]
       },
-      node: false
     };
   }
 

package/src/builder/SdCliJsLibBuilder.ts

@@ -25,7 +25,7 @@ export class SdCliJsLibBuilder extends EventEmitter {
 
     const relatedPaths = await this.getRelatedPathsAsync();
     const watcher = SdFsWatcher.watch(relatedPaths);
-    watcher.onChange(async (changeInfos) => {
+    watcher.onChange({}, async (changeInfos) => {
       const changeFilePaths = changeInfos.filter((item) => ["add", "change", "unlink"].includes(item.event)).map((item) => item.path);
       if(changeFilePaths.length === 0) return;
 

package/src/builder/SdCliServerBuilder.ts

@@ -50,9 +50,8 @@ export class SdCliServerBuilder extends EventEmitter {
     await new Promise<void>((resolve, reject) => {
       compiler.hooks.watchRun.tapAsync(this.constructor.name, (args, callback) => {
         this.emit("change");
-        callback();
-
         this._logger.debug("Webpack 빌드 수행...");
+        callback();
       });
 
       compiler.watch({}, async (err, stats) => {
@@ -65,11 +64,9 @@ export class SdCliServerBuilder extends EventEmitter {
         await this._writeDistConfigFileAsync();
 
         // 결과 반환
+        this._logger.debug("Webpack 빌드 완료");
         const results = SdCliBuildResultUtil.convertFromWebpackStats(stats);
         this.emit("complete", results);
-
-        // 마무리
-        this._logger.debug("Webpack 빌드 완료");
         resolve();
       });
     });
@@ -239,7 +236,9 @@ export class SdCliServerBuilder extends EventEmitter {
         outputModule: true
       },
       performance: { hints: false },
-      node: false,
+      node: {
+        __dirname: true
+      },
       stats: "errors-warnings",
       externals: extModuleNames,
       ...watch ? {

package/src/builder/SdCliTsLibBuilder.ts

@@ -66,7 +66,7 @@ export class SdCliTsLibBuilder extends EventEmitter {
 
     const relatedPaths = await this.getAllRelatedPathsAsync();
     const watcher = SdFsWatcher.watch(relatedPaths);
-    watcher.onChange(async (changeInfos) => {
+    watcher.onChange({}, async (changeInfos) => {
       const changeFilePaths = changeInfos.filter((item) => ["add", "change", "unlink"].includes(item.event)).map((item) => item.path);
       if (changeFilePaths.length === 0) return;
 

package/src/commons.ts

@@ -40,7 +40,7 @@ export interface ISdCliConfig {
   localUpdates?: Record<string, string>;
 }
 
-export type TSdCliPackageConfig = ISdCliLibPackageConfig | ISdCliServerPackageConfig;
+export type TSdCliPackageConfig = ISdCliLibPackageConfig | ISdCliServerPackageConfig | ISdCliClientPackageConfig;
 
 export interface ISdCliLibPackageConfig {
   type: "library";
@@ -54,3 +54,8 @@ export interface ISdCliServerPackageConfig {
   pm2?: Record<string, any> | boolean;
   iis?: { serverExeFilePath?: string } | boolean;
 }
+
+export interface ISdCliClientPackageConfig {
+  type: "client";
+  server: string;
+}

package/src/entry-points/SdCliLocalUpdate.ts

@@ -40,19 +40,25 @@ export class SdCliLocalUpdate {
     const watchPaths = (await updatePathInfos.mapManyAsync(async (item) => await this._getWatchPathsAsync(item.source))).distinct();
 
     const watcher = SdFsWatcher.watch(watchPaths);
-    watcher.onChange(async (changeInfos) => {
+    watcher.onChange({ delay: 1000 }, async (changeInfos) => {
       const changeFilePaths = changeInfos.filter((item) => ["add", "change", "unlink"].includes(item.event)).map((item) => item.path);
       if (changeFilePaths.length === 0) return;
 
       this._logger.log("로컬 라이브러리 변경감지...");
       for (const changedFilePath of changeFilePaths) {
-        const currentUpdatePathInfos = updatePathInfos.filter((item) => PathUtil.isChildPath(changedFilePath, item.source));
-        const targetFilePaths = currentUpdatePathInfos.map((item) => path.resolve(item.target, path.relative(item.source, changedFilePath)));
-        if (FsUtil.exists(changedFilePath)) {
-          this._logger.debug(`변경파일감지(복사): ${changedFilePath}`);
-          for (const targetFilePath of targetFilePaths) {
-            await FsUtil.copyAsync(changedFilePath, targetFilePath);
-          }
+        if (!FsUtil.exists(changedFilePath)) continue;
+
+        for (const updatePathInfo of updatePathInfos) {
+          if (!PathUtil.isChildPath(changedFilePath, updatePathInfo.source)) continue;
+
+          const sourceRelPath = path.relative(updatePathInfo.source, changedFilePath);
+          if (sourceRelPath.includes("node_modules")) continue;
+          if (sourceRelPath.includes("package.json")) continue;
+
+          const targetFilePath = path.resolve(updatePathInfo.target, sourceRelPath);
+
+          this._logger.debug(`변경파일감지(복사): ${changedFilePath} => ${targetFilePath}`);
+          await FsUtil.copyAsync(changedFilePath, targetFilePath);
         }
       }
 

package/src/entry-points/SdCliPrepare.ts

@@ -1,4 +1,5 @@
 import { FsUtil, Logger } from "@simplysm/sd-core-node";
+import { fileURLToPath } from "url";
 
 export class SdCliPrepare {
   private readonly _logger = Logger.get(["simplysm", "sd-cli", this.constructor.name]);
@@ -11,7 +12,7 @@ export class SdCliPrepare {
 
   private async _modifyTypescriptCodeForTypeCheckPerformanceWarning(): Promise<boolean> {
     const fileUrl = await import.meta.resolve!("typescript");
-    const filePath = fileUrl.replace(/^file:\/\/\//, "");
+    const filePath = fileURLToPath(fileUrl);
     const fileContent = await FsUtil.readFileAsync(filePath);
     const modifiedFileContent = fileContent.replace(`
         function checkSourceElement(node) {