Merge pull request #15207 from backstage/eide/webpack-cache

[cli]: Enable cache for production build using experimental env var

packages/cli/src/lib/bundler/bundle.ts

@@ -42,7 +42,6 @@ export async function buildBundle(options: BuildOptions) {
     isDev: false,
     baseUrl: resolveBaseUrl(options.frontendConfig),
   });
-  const compiler = webpack(config);
 
   const isCi = yn(process.env.CI, { default: false });
 
@@ -64,7 +63,7 @@ export async function buildBundle(options: BuildOptions) {
     );
   }
 
-  const { stats } = await build(compiler, isCi).catch(error => {
+  const { stats } = await build(config, isCi).catch(error => {
     console.log(chalk.red('Failed to compile.\n'));
     throw new Error(`Failed to compile.\n${error.message || error}`);
   });
@@ -90,10 +89,10 @@ export async function buildBundle(options: BuildOptions) {
   );
 }
 
-async function build(compiler: webpack.Compiler, isCi: boolean) {
+async function build(config: webpack.Configuration, isCi: boolean) {
   const stats = await new Promise<webpack.Stats | undefined>(
     (resolve, reject) => {
-      compiler.run((err, buildStats) => {
+      webpack(config, (err, buildStats) => {
         if (err) {
           if (err.message) {
             const { errors } = formatWebpackMessages({

packages/cli/src/lib/bundler/config.ts

@@ -35,6 +35,9 @@ import { paths as cliPaths } from '../../lib/paths';
 import { runPlain } from '../run';
 import ESLintPlugin from 'eslint-webpack-plugin';
 import pickBy from 'lodash/pickBy';
+import yn from 'yn';
+
+const BUILD_CACHE_ENV_VAR = 'BACKSTAGE_CLI_EXPERIMENTAL_BUILD_CACHE';
 
 export function resolveBaseUrl(config: Config): URL {
   const baseUrl = config.getString('app.baseUrl');
@@ -146,6 +149,8 @@ export async function createConfig(
     require.resolve('react-refresh'),
   ];
 
+  const withCache = yn(process.env[BUILD_CACHE_ENV_VAR], { default: false });
+
   return {
     mode: isDev ? 'development' : 'production',
     profile: false,
@@ -206,6 +211,16 @@ export async function createConfig(
         : {}),
     },
     plugins,
+    ...(withCache
+      ? {
+          cache: {
+            type: 'filesystem',
+            buildDependencies: {
+              config: [__filename],
+            },
+          },
+        }
+      : {}),
   };
 }