feat: support --watch-only

sorrycc · sorrycc · commit a04eca99b3e7 · 2024-07-30T23:13:27.000+08:00
diff --git a/src/builder/bundle/index.ts b/src/builder/bundle/index.ts
@@ -28,159 +28,162 @@ interface IBundleOpts {
   configProvider: BundleConfigProvider;
   buildDependencies?: string[];
   watch?: boolean;
+  watchOnly?: boolean;
 }
 
-function bundle(opts: Omit<IBundleOpts, 'watch'>): Promise<void>;
+function bundle(opts: Omit<IBundleOpts, 'watch' | 'watchOnly'>): Promise<void>;
 function bundle(opts: IBundleOpts): Promise<IBundleWatcher>;
 async function bundle(opts: IBundleOpts): Promise<void | IBundleWatcher> {
   const enableCache = process.env.FATHER_CACHE !== 'none';
   const closeHandlers: webpack.Watching['close'][] = [];
 
-  for (let i = 0; i < opts.configProvider.configs.length; i += 1) {
-    const config = opts.configProvider.configs[i];
-    const { plugins: extraPostCSSPlugins, ...postcssLoader } =
-      config.postcssOptions || {};
-    const babelSCOpts = getBabelStyledComponentsOpts(opts.configProvider.pkg);
-    // workaround for combine continuous onBuildComplete log in watch mode
-    const logStatus = lodash.debounce(
-      () =>
-        logger.info(
-          `Bundle from ${chalk.yellow(config.entry)} to ${chalk.yellow(
-            path.join(config.output.path, config.output.filename),
-          )}`,
-        ),
-      100,
-      { leading: true, trailing: false },
-    );
-
-    // log for normal build
-    !opts.watch && logStatus();
-    await bundler.build({
-      cwd: opts.cwd,
-      watch: opts.watch,
-      config: {
-        alias: config.alias,
-        autoprefixer: config.autoprefixer,
-        chainWebpack: config.chainWebpack,
-        define: config.define,
-        devtool: config.sourcemap && 'source-map',
-        externals: config.externals,
-        outputPath: config.output.path,
-
-        // postcss config
-        extraPostCSSPlugins,
-        postcssLoader,
-
-        ...(config.extractCSS !== false ? {} : { styleLoader: {} }),
-
-        // less config
-        theme: config.theme,
-
-        // compatible with IE11 by default
-        targets: getBundleTargets(config),
-        jsMinifier: JSMinifier.terser,
-        cssMinifier: CSSMinifier.cssnano,
-        extraBabelIncludes: [/node_modules/],
-
-        // set cache parent directory, will join it with `bundler-webpack`
-        // ref: https://github.com/umijs/umi/blob/8dad8c5af0197cd62db11f4b4c85d6bc1db57db1/packages/bundler-webpack/src/build.ts#L32
-        cacheDirectoryPath: getCachePath(),
-      },
-      entry: {
-        [path.parse(config.output.filename).name]: path.join(
-          opts.cwd,
-          config.entry,
-        ),
-      },
-      babelPreset: [
-        require.resolve('@umijs/babel-preset-umi'),
-        {
-          presetEnv: {
-            targets: getBundleTargets(config),
-          },
-          presetReact: getBabelPresetReactOpts(
-            opts.configProvider.pkg,
+  if (!opts.watchOnly) {
+    for (let i = 0; i < opts.configProvider.configs.length; i += 1) {
+      const config = opts.configProvider.configs[i];
+      const { plugins: extraPostCSSPlugins, ...postcssLoader } =
+        config.postcssOptions || {};
+      const babelSCOpts = getBabelStyledComponentsOpts(opts.configProvider.pkg);
+      // workaround for combine continuous onBuildComplete log in watch mode
+      const logStatus = lodash.debounce(
+        () =>
+          logger.info(
+            `Bundle from ${chalk.yellow(config.entry)} to ${chalk.yellow(
+              path.join(config.output.path, config.output.filename),
+            )}`,
+          ),
+        100,
+        { leading: true, trailing: false },
+      );
+
+      // log for normal build
+      !opts.watch && logStatus();
+      await bundler.build({
+        cwd: opts.cwd,
+        watch: opts.watch,
+        config: {
+          alias: config.alias,
+          autoprefixer: config.autoprefixer,
+          chainWebpack: config.chainWebpack,
+          define: config.define,
+          devtool: config.sourcemap && 'source-map',
+          externals: config.externals,
+          outputPath: config.output.path,
+
+          // postcss config
+          extraPostCSSPlugins,
+          postcssLoader,
+
+          ...(config.extractCSS !== false ? {} : { styleLoader: {} }),
+
+          // less config
+          theme: config.theme,
+
+          // compatible with IE11 by default
+          targets: getBundleTargets(config),
+          jsMinifier: JSMinifier.terser,
+          cssMinifier: CSSMinifier.cssnano,
+          extraBabelIncludes: [/node_modules/],
+
+          // set cache parent directory, will join it with `bundler-webpack`
+          // ref: https://github.com/umijs/umi/blob/8dad8c5af0197cd62db11f4b4c85d6bc1db57db1/packages/bundler-webpack/src/build.ts#L32
+          cacheDirectoryPath: getCachePath(),
+        },
+        entry: {
+          [path.parse(config.output.filename).name]: path.join(
             opts.cwd,
+            config.entry,
           ),
-          presetTypeScript: {},
-          pluginTransformRuntime: {},
-          pluginLockCoreJS: {},
-          pluginDynamicImportNode: false,
         },
-      ],
-      beforeBabelPlugins: [
-        require.resolve('babel-plugin-dynamic-import-node'),
-        ...(babelSCOpts
-          ? [[require.resolve('babel-plugin-styled-components'), babelSCOpts]]
-          : []),
-      ],
-      extraBabelPresets: config.extraBabelPresets,
-      extraBabelPlugins: config.extraBabelPlugins,
-
-      // configure library related options
-      chainWebpack(memo: any) {
-        memo.output.libraryTarget('umd');
-
-        if (config?.name) {
-          memo.output.library(config.name);
-        }
-
-        // modify webpack target
-        if (config.platform === 'node') {
-          memo.target('node');
-        }
-
-        if (enableCache) {
-          // use father version as cache version
-          memo.merge({
-            cache: { version: require('../../../package.json').version },
-          });
-        }
-
-        // also bundle svg as asset, because father force disable svgr
-        const imgRule = memo.module.rule('asset').oneOf('image');
-
-        imgRule.test(
-          new RegExp(imgRule.get('test').source.replace(/(\|png)/, '$1|svg')),
-        );
+        babelPreset: [
+          require.resolve('@umijs/babel-preset-umi'),
+          {
+            presetEnv: {
+              targets: getBundleTargets(config),
+            },
+            presetReact: getBabelPresetReactOpts(
+              opts.configProvider.pkg,
+              opts.cwd,
+            ),
+            presetTypeScript: {},
+            pluginTransformRuntime: {},
+            pluginLockCoreJS: {},
+            pluginDynamicImportNode: false,
+          },
+        ],
+        beforeBabelPlugins: [
+          require.resolve('babel-plugin-dynamic-import-node'),
+          ...(babelSCOpts
+            ? [[require.resolve('babel-plugin-styled-components'), babelSCOpts]]
+            : []),
+        ],
+        extraBabelPresets: config.extraBabelPresets,
+        extraBabelPlugins: config.extraBabelPlugins,
+
+        // configure library related options
+        chainWebpack(memo: any) {
+          memo.output.libraryTarget('umd');
+
+          if (config?.name) {
+            memo.output.library(config.name);
+          }
 
-        // disable progress bar
-        memo.plugins.delete('progress-plugin');
+          // modify webpack target
+          if (config.platform === 'node') {
+            memo.target('node');
+          }
 
-        // auto bump analyze port
-        /* istanbul ignore if -- @preserve */
-        if (process.env.ANALYZE) {
-          memo.plugin('webpack-bundle-analyzer').tap((args: any) => {
-            args[0].analyzerPort += i;
+          if (enableCache) {
+            // use father version as cache version
+            memo.merge({
+              cache: { version: require('../../../package.json').version },
+            });
+          }
 
-            return args;
-          });
-        }
+          // also bundle svg as asset, because father force disable svgr
+          const imgRule = memo.module.rule('asset').oneOf('image');
 
-        return memo;
-      },
+          imgRule.test(
+            new RegExp(imgRule.get('test').source.replace(/(\|png)/, '$1|svg')),
+          );
+
+          // disable progress bar
+          memo.plugins.delete('progress-plugin');
+
+          // auto bump analyze port
+          /* istanbul ignore if -- @preserve */
+          if (process.env.ANALYZE) {
+            memo.plugin('webpack-bundle-analyzer').tap((args: any) => {
+              args[0].analyzerPort += i;
+
+              return args;
+            });
+          }
+
+          return memo;
+        },
 
-      // enable webpack persistent cache
-      ...(enableCache
-        ? {
+        // enable webpack persistent cache
+        ...(enableCache
+          ? {
             cache: {
               buildDependencies: opts.buildDependencies,
             },
           }
-        : {}),
+          : {}),
 
-      // collect close handlers for watch mode
-      ...(opts.watch
-        ? {
+        // collect close handlers for watch mode
+        ...(opts.watch
+          ? {
             onBuildComplete({ isFirstCompile, close }: any) {
               if (isFirstCompile) closeHandlers.push(close);
               // log for watch mode
               else logStatus();
             },
           }
-        : {}),
-      disableCopy: true,
-    });
+          : {}),
+        disableCopy: true,
+      });
+    }
   }
 
   // return watching closer for watch mode
diff --git a/src/builder/bundless/index.ts b/src/builder/bundless/index.ts
@@ -39,6 +39,7 @@ async function transformFiles(
     cwd: string;
     configProvider: BundlessConfigProvider;
     watch?: true;
+    watchOnly?: boolean;
   },
 ) {
   try {
@@ -102,8 +103,7 @@ async function transformFiles(
         }
 
         logger.quietExpect.event(
-          `Bundless ${chalk.gray(item)} to ${chalk.gray(itemDistPath)}${
-            result?.options.declaration ? ' (with declaration)' : ''
+          `Bundless ${chalk.gray(item)} to ${chalk.gray(itemDistPath)}${result?.options.declaration ? ' (with declaration)' : ''
           }`,
         );
         count += 1;
@@ -164,18 +164,20 @@ async function bundless(
   logger.info(statusText);
 
   const startTime = Date.now();
-  const matches = glob.sync(`${opts.configProvider.input}/**`, {
-    cwd: opts.cwd,
-    ignore: DEFAULT_BUNDLESS_IGNORES,
-    nodir: true,
-  });
-  const count = await transformFiles(matches, opts);
+  let count = 0;
+  if (!opts.watchOnly) {
+    const matches = glob.sync(`${opts.configProvider.input}/**`, {
+      cwd: opts.cwd,
+      ignore: DEFAULT_BUNDLESS_IGNORES,
+      nodir: true,
+    });
+    count = await transformFiles(matches, opts);
+  }
 
   if (!opts.watch) {
     // output result for normal mode
     logger.quietExpect.event(
-      `Transformed successfully in ${
-        Date.now() - startTime
+      `Transformed successfully in ${Date.now() - startTime
       } ms (${count} files)`,
     );
   } else {
@@ -227,10 +229,10 @@ async function bundless(
           // TODO: collect real emit files
           const relatedFiles = isTsFile
             ? [
-                replacePathExt(fileDistAbsPath, '.js'),
-                replacePathExt(fileDistAbsPath, '.d.ts'),
-                replacePathExt(fileDistAbsPath, '.d.ts.map'),
-              ]
+              replacePathExt(fileDistAbsPath, '.js'),
+              replacePathExt(fileDistAbsPath, '.d.ts'),
+              replacePathExt(fileDistAbsPath, '.d.ts.map'),
+            ]
             : [fileDistAbsPath];
           const relatedMainFile = relatedFiles.find((item) =>
             fs.existsSync(item),
diff --git a/src/builder/index.ts b/src/builder/index.ts
@@ -41,11 +41,11 @@ interface IWatchBuilderResult {
 // overload normal/watch mode
 function builder(opts: IBuilderOpts): Promise<void>;
 function builder(
-  opts: IBuilderOpts & { watch: true },
+  opts: IBuilderOpts & { watch: true, watchOnly?: boolean },
 ): Promise<IWatchBuilderResult>;
 
 async function builder(
-  opts: IBuilderOpts & { watch?: true },
+  opts: IBuilderOpts & { watch?: true, watchOnly?: boolean },
 ): Promise<IWatchBuilderResult | void> {
   const configProviders = createConfigProviders(
     opts.userConfig,
@@ -69,6 +69,7 @@ async function builder(
       configProvider: configProviders.bundle,
       buildDependencies: opts.buildDependencies,
       watch: opts.watch,
+      watchOnly: opts.watchOnly,
     });
 
     opts.watch && watchers.push(watcher);
@@ -79,6 +80,7 @@ async function builder(
       cwd: opts.cwd,
       configProvider: configProviders.bundless.esm,
       watch: opts.watch,
+      watchOnly: opts.watchOnly,
     });
 
     opts.watch && watchers.push(watcher);
@@ -89,6 +91,7 @@ async function builder(
       cwd: opts.cwd,
       configProvider: configProviders.bundless.cjs,
       watch: opts.watch,
+      watchOnly: opts.watchOnly,
     });
 
     opts.watch && watchers.push(watcher);
diff --git a/src/commands/dev.ts b/src/commands/dev.ts
@@ -16,6 +16,7 @@ export default (api: IApi) => {
         cwd: api.cwd,
         pkg: api.pkg,
         watch: true,
+        watchOnly: args.watchOnly,
         clean: args.clean,
       });
 
