diff --git a/.changeset/moody-papayas-mix.md b/.changeset/moody-papayas-mix.md new file mode 100644 index 00000000..aa2cba68 --- /dev/null +++ b/.changeset/moody-papayas-mix.md @@ -0,0 +1,5 @@ +--- +"@workleap/webpack-configs": minor +--- + +Enable in-memory webpack cache by default diff --git a/docs/webpack/configure-build.md b/docs/webpack/configure-build.md index d6b33343..5ae719ea 100644 --- a/docs/webpack/configure-build.md +++ b/docs/webpack/configure-build.md @@ -203,43 +203,6 @@ export default defineBuildConfig(swcConfig, { }); ``` -### `cache` - -- **Type**: `boolean` -- **Default**: `true` - -Whether or not webpack [filesystem cache](https://webpack.js.org/configuration/cache/) is enabled. - -```js !#7 webpack.build.js -// @ts-check - -import { defineDevConfig } from "@workleap/webpack-configs"; -import { swcConfig } from "./swc.build.js"; - -export default defineBuildConfig(swcConfig, { - cache: false -}); -``` - -### `cacheDirectory` - -- **Type**: `string` -- **Default**: `node_modules/.cache/webpack` - -```js !#8 webpack.build.js -// @ts-check - -import { defineBuildConfig } from "@workleap/webpack-configs"; -import { swcConfig } from "./swc.build.js"; -import path from "path"; - -export default defineBuildConfig(swcConfig, { - cacheDirectory: path.resolve("./custom-webpack-cache") -}); -``` - -Set webpack [cacheDirectory option](https://webpack.js.org/configuration/cache/#cachecachedirectory) when `cache` is enabled. - ### `moduleRules` - **Type**: An array of webpack [moduleRule](https://webpack.js.org/configuration/module/#modulerules) objects diff --git a/docs/webpack/configure-dev.md b/docs/webpack/configure-dev.md index 33b6f5c3..7d91a40c 100644 --- a/docs/webpack/configure-dev.md +++ b/docs/webpack/configure-dev.md @@ -244,7 +244,7 @@ export default defineDevConfig(swcConfig, { - **Type**: `boolean` - **Default**: `true` -Whether or not webpack [filesystem cache](https://webpack.js.org/configuration/cache/) is enabled. +Whether or not webpack [memory cache](https://webpack.js.org/configuration/cache/#cache) is enabled. This will also set [maxGenerations](https://webpack.js.org/configuration/cache/#cachemaxgenerations) to 1 to remove cache entries from memory when they are no longer needed. ```js !#7 webpack.dev.js // @ts-check @@ -257,25 +257,6 @@ export default defineDevConfig(swcConfig, { }); ``` -### `cacheDirectory` - -- **Type**: `string` -- **Default**: `node_modules/.cache/webpack` - -```js !#8 webpack.dev.js -// @ts-check - -import { defineDevConfig } from "@workleap/webpack-configs"; -import { swcConfig } from "./swc.dev.js"; -import path from "path"; - -export default defineDevConfig(swcConfig, { - cacheDirectory: path.resolve("./custom-webpack-cache") -}); -``` - -Set webpack [cacheDirectory option](https://webpack.js.org/configuration/cache/#cachecachedirectory) when `cache` is enabled. - ### `moduleRules` - **Type**: An array of webpack [moduleRule](https://webpack.js.org/configuration/module/#modulerules) objects diff --git a/packages/webpack-configs/src/build.ts b/packages/webpack-configs/src/build.ts index 35343004..cafdb3b7 100644 --- a/packages/webpack-configs/src/build.ts +++ b/packages/webpack-configs/src/build.ts @@ -4,7 +4,6 @@ import HtmlWebpackPlugin from "html-webpack-plugin"; import MiniCssExtractPlugin from "mini-css-extract-plugin"; import { createRequire } from "node:module"; import path from "node:path"; -import { fileURLToPath } from "node:url"; import TerserPlugin from "terser-webpack-plugin"; import type { Configuration as WebpackConfig } from "webpack"; import webpack from "webpack"; @@ -19,9 +18,6 @@ const DefinePlugin = webpack.DefinePlugin; // is available const require = createRequire(import.meta.url); -// The equivalent of __filename for CommonJS. -const __filename = fileURLToPath(import.meta.url); - export function defineBuildHtmlWebpackPluginConfig(options: HtmlWebpackPlugin.Options = {}): HtmlWebpackPlugin.Options { const { template = path.resolve("./public/index.html"), @@ -107,8 +103,6 @@ export interface DefineBuildConfigOptions { entry?: string; outputPath?: string; publicPath?: `${string}/` | "auto"; - cache?: boolean; - cacheDirectory?: string; moduleRules?: NonNullable["rules"]; plugins?: WebpackConfig["plugins"]; htmlWebpackPlugin?: boolean | HtmlWebpackPlugin.Options; @@ -127,8 +121,6 @@ export function defineBuildConfig(swcConfig: SwcConfig, options: DefineBuildConf outputPath = path.resolve("dist"), // The trailing / is very important, otherwise paths will not be resolved correctly. publicPath = "http://localhost:8080/", - cache = true, - cacheDirectory = path.resolve("node_modules/.cache/webpack"), moduleRules = [], plugins = [], htmlWebpackPlugin = defineBuildHtmlWebpackPluginConfig(), @@ -153,37 +145,6 @@ export function defineBuildConfig(swcConfig: SwcConfig, options: DefineBuildConf publicPath, clean: true }, - cache: cache && { - type: "filesystem", - allowCollectingMemory: false, - cacheDirectory: cacheDirectory, - maxMemoryGenerations: 1, - // Took from https://webpack.js.org/configuration/cache/#cachebuilddependencies. - buildDependencies: { - config: [__filename] - } - }, - // (ACTUALLY NOT FIXING ANYTHING AT THE MOMENT) - // Fixes caching for environmental variables using the DefinePlugin by forcing - // webpack caching to prioritize hashes over timestamps. - snapshot: cache ? { - buildDependencies: { - hash: true, - timestamp: true - }, - module: { - hash: true, - timestamp: true - }, - resolve: { - hash: true, - timestamp: true - }, - resolveBuildDependencies: { - hash: true, - timestamp: true - } - } : undefined, optimization: getOptimizationConfig(optimize), infrastructureLogging: verbose ? { appendOnly: true, diff --git a/packages/webpack-configs/src/dev.ts b/packages/webpack-configs/src/dev.ts index a77ee088..7e6a776e 100644 --- a/packages/webpack-configs/src/dev.ts +++ b/packages/webpack-configs/src/dev.ts @@ -5,7 +5,6 @@ import type { Config as SwcConfig } from "@swc/core"; import HtmlWebpackPlugin from "html-webpack-plugin"; import { createRequire } from "node:module"; import path from "node:path"; -import { fileURLToPath } from "node:url"; import type { Configuration as WebpackConfig } from "webpack"; import webpack from "webpack"; import type { ServerOptions } from "webpack-dev-server"; @@ -23,9 +22,6 @@ const DefinePlugin = webpack.DefinePlugin; // is available const require = createRequire(import.meta.url); -// The equivalent of __filename for CommonJS. -const __filename = fileURLToPath(import.meta.url); - export function defineDevHtmlWebpackPluginConfig(options: HtmlWebpackPlugin.Options = {}): HtmlWebpackPlugin.Options { const { template = path.resolve("./public/index.html"), @@ -49,7 +45,6 @@ export interface DefineDevConfigOptions { port?: number; publicPath?: `${string}/` | "auto"; cache?: boolean; - cacheDirectory?: string; moduleRules?: NonNullable["rules"]; plugins?: WebpackConfig["plugins"]; htmlWebpackPlugin?: boolean | HtmlWebpackPlugin.Options; @@ -94,7 +89,6 @@ export function defineDevConfig(swcConfig: SwcConfig, options: DefineDevConfigOp port = 8080, publicPath, cache = true, - cacheDirectory = path.resolve("node_modules/.cache/webpack"), moduleRules = [], plugins = [], htmlWebpackPlugin = defineDevHtmlWebpackPluginConfig(), @@ -134,36 +128,9 @@ export function defineDevConfig(swcConfig: SwcConfig, options: DefineDevConfigOp publicPath: publicPath ?? `${https ? "https" : "http"}://${host}:${port}/` }, cache: cache && { - type: "filesystem", - allowCollectingMemory: true, - maxMemoryGenerations: 1, - cacheDirectory: cacheDirectory, - // Took from https://webpack.js.org/configuration/cache/#cachebuilddependencies. - buildDependencies: { - config: [__filename] - } + type: "memory", + maxGenerations: 1 }, - // (ACTUALLY NOT FIXING ANYTHING AT THE MOMENT) - // Fixes caching for environmental variables using the DefinePlugin by forcing - // webpack caching to prioritize hashes over timestamps. - snapshot: cache ? { - buildDependencies: { - hash: true, - timestamp: true - }, - module: { - hash: true, - timestamp: true - }, - resolve: { - hash: true, - timestamp: true - }, - resolveBuildDependencies: { - hash: true, - timestamp: true - } - } : undefined, // See: https://webpack.js.org/guides/build-performance/#avoid-extra-optimization-steps optimization: { // Keep "runtimeChunk" to false, otherwise it breaks module federation diff --git a/packages/webpack-configs/tests/build.test.ts b/packages/webpack-configs/tests/build.test.ts index 4cc88e65..516bc6ad 100644 --- a/packages/webpack-configs/tests/build.test.ts +++ b/packages/webpack-configs/tests/build.test.ts @@ -1,6 +1,6 @@ import { defineBuildConfig as defineSwcConfig } from "@workleap/swc-configs"; import HtmlWebpackPlugin from "html-webpack-plugin"; -import type { Configuration, FileCacheOptions, RuleSetRule } from "webpack"; +import type { Configuration, RuleSetRule } from "webpack"; import { defineBuildConfig, defineBuildHtmlWebpackPluginConfig, defineMiniCssExtractPluginConfig } from "../src/build.ts"; import type { WebpackConfigTransformer } from "../src/transformers/applyTransformers.ts"; import { findModuleRule, matchAssetModuleType, matchLoaderName } from "../src/transformers/moduleRules.ts"; @@ -171,31 +171,6 @@ test("when optimize is \"readable\", include minify configuration", () => { expect(result.optimization?.minimizer).toBeDefined(); }); -test("when cache is enabled, the cache configuration is included", () => { - const result = defineBuildConfig(SwcConfig, { - cache: true - }); - - expect(result.cache).toBeDefined(); -}); - -test("when cache is disabled, the cache prop is false", () => { - const result = defineBuildConfig(SwcConfig, { - cache: false - }); - - expect(result.cache).toBeFalsy(); -}); - -test("when a cache directory is provided and cache is enabled, use the provided cache directory value", () => { - const result = defineBuildConfig(SwcConfig, { - cache: true, - cacheDirectory: "a-custom-path" - }); - - expect((result.cache as FileCacheOptions).cacheDirectory).toBe("a-custom-path"); -}); - test("when htmlWebpackPlugin is \"false\", no html-webpack-plugin instance is added to the plugin array", () => { const config = defineBuildConfig(SwcConfig, { htmlWebpackPlugin: false diff --git a/packages/webpack-configs/tests/dev.test.ts b/packages/webpack-configs/tests/dev.test.ts index 5b6817e0..4ec23b9a 100644 --- a/packages/webpack-configs/tests/dev.test.ts +++ b/packages/webpack-configs/tests/dev.test.ts @@ -2,7 +2,7 @@ import ReactRefreshWebpackPlugin from "@pmmmwh/react-refresh-webpack-plugin"; import type { Config as SwcConfig } from "@swc/core"; import { defineDevConfig as defineSwcConfig } from "@workleap/swc-configs"; import HtmlWebpackPlugin from "html-webpack-plugin"; -import type { Configuration, FileCacheOptions, RuleSetRule } from "webpack"; +import type { Configuration, RuleSetRule } from "webpack"; import type { ClientConfiguration, ServerConfiguration } from "webpack-dev-server"; import { defineDevConfig, defineDevHtmlWebpackPluginConfig, defineFastRefreshPluginConfig } from "../src/dev.ts"; import type { WebpackConfigTransformer } from "../src/transformers/applyTransformers.ts"; @@ -109,15 +109,6 @@ test("when cache is disabled, the cache prop is false", () => { expect(result.cache).toBeFalsy(); }); -test("when a cache directory is provided and cache is enabled, use the provided cache directory value", () => { - const result = defineDevConfig(DefaultConfig, { - cache: true, - cacheDirectory: "a-custom-path" - }); - - expect((result.cache as FileCacheOptions).cacheDirectory).toBe("a-custom-path"); -}); - test("when additional module rules are provided, append the provided rules at the end of the module rules array", () => { const newModuleRule1 = { test: /\.svg/i,