shakapacker 8.4.0 → 9.0.0

data/package/plugins/webpack.ts

@@ -0,0 +1,62 @@
+const { requireOrError } = require("../utils/requireOrError")
+// TODO: Change to `const { WebpackAssetsManifest }` when dropping 'webpack-assets-manifest < 6.0.0' (Node >=20.10.0) support
+const WebpackAssetsManifest = requireOrError("webpack-assets-manifest")
+const webpack = requireOrError("webpack")
+const config = require("../config")
+const { isProduction } = require("../env")
+const { moduleExists } = require("../utils/helpers")
+
+const getPlugins = (): unknown[] => {
+  // TODO: Remove WebpackAssetsManifestConstructor workaround when dropping 'webpack-assets-manifest < 6.0.0' (Node >=20.10.0) support
+  const WebpackAssetsManifestConstructor =
+    "WebpackAssetsManifest" in WebpackAssetsManifest
+      ? WebpackAssetsManifest.WebpackAssetsManifest
+      : WebpackAssetsManifest
+  const plugins = [
+    new webpack.EnvironmentPlugin(process.env),
+    new WebpackAssetsManifestConstructor({
+      entrypoints: true,
+      writeToDisk: true,
+      output: config.manifestPath,
+      entrypointsUseAssets: true,
+      publicPath: config.publicPathWithoutCDN,
+      integrity: config.integrity.enabled,
+      integrityHashes: config.integrity.hash_functions
+    })
+  ]
+
+  if (moduleExists("css-loader") && moduleExists("mini-css-extract-plugin")) {
+    const hash = isProduction || config.useContentHash ? "-[contenthash:8]" : ""
+    const MiniCssExtractPlugin = requireOrError("mini-css-extract-plugin")
+    plugins.push(
+      new MiniCssExtractPlugin({
+        filename: `css/[name]${hash}.css`,
+        chunkFilename: `css/[id]${hash}.css`,
+        // For projects where css ordering has been mitigated through consistent use of scoping or naming conventions,
+        // the css order warnings can be disabled by setting the ignoreOrder flag.
+        ignoreOrder: config.css_extract_ignore_order_warnings
+      })
+    )
+  }
+
+  if (
+    config.integrity.enabled &&
+    moduleExists("webpack-subresource-integrity")
+  ) {
+    const SubresourceIntegrityPlugin = requireOrError(
+      "webpack-subresource-integrity"
+    )
+    plugins.push(
+      new SubresourceIntegrityPlugin({
+        hashFuncNames: config.integrity.hash_functions,
+        enabled: isProduction
+      })
+    )
+  }
+
+  return plugins
+}
+
+export = {
+  getPlugins
+}

data/package/rspack/index.ts

@@ -0,0 +1,64 @@
+/* eslint global-require: 0 */
+/* eslint import/no-dynamic-require: 0 */
+
+// Mixed require/import syntax:
+// - Using require() for compiled JS modules that may not have proper ES module exports
+// - Using import for type-only imports and Node.js built-in modules
+const webpackMerge = require("webpack-merge")
+import { resolve } from "path"
+import { existsSync } from "fs"
+import type { RspackConfigWithDevServer } from "../environments/types"
+const config = require("../config")
+const baseConfig = require("../environments/base")
+const devServer = require("../dev_server")
+const env = require("../env")
+const { moduleExists, canProcess } = require("../utils/helpers")
+const inliningCss = require("../utils/inliningCss")
+const { getPlugins } = require("../plugins/rspack")
+const { getOptimization } = require("../optimization/rspack")
+const { validateRspackDependencies } = require("../utils/validateDependencies")
+
+const rulesPath = resolve(__dirname, "../rules", "rspack.js")
+const rules = require(rulesPath)
+
+const generateRspackConfig = (extraConfig: RspackConfigWithDevServer = {}, ...extraArgs: unknown[]): RspackConfigWithDevServer => {
+  // Validate required dependencies first
+  validateRspackDependencies()
+  if (extraArgs.length > 0) {
+    throw new Error(
+      "Only one extra config may be passed here - use webpack-merge to merge configs before passing them to Shakapacker"
+    )
+  }
+
+  const { nodeEnv } = env
+  const path = resolve(__dirname, "../environments", `${nodeEnv}.js`)
+  // eslint-disable-next-line @typescript-eslint/no-require-imports
+  const environmentConfig = existsSync(path) ? require(path) : baseConfig
+
+  // Create base rspack config
+  const rspackConfig: RspackConfigWithDevServer = {
+    ...environmentConfig,
+    module: {
+      rules
+    },
+    plugins: getPlugins(),
+    optimization: getOptimization()
+  }
+
+  return webpackMerge.merge({}, rspackConfig, extraConfig)
+}
+
+// Re-export webpack-merge utilities for backward compatibility
+export { merge, mergeWithCustomize, mergeWithRules, unique } from "webpack-merge"
+
+export {
+  config, // shakapacker.yml
+  devServer,
+  generateRspackConfig,
+  baseConfig,
+  env,
+  rules,
+  moduleExists,
+  canProcess,
+  inliningCss
+}

data/package/rules/{babel.js → babel.ts}

@@ -1,9 +1,9 @@
 const { loaderMatches } = require("../utils/helpers")
-const { webpack_loader: webpackLoader } = require("../config")
+const { javascript_transpiler: javascriptTranspiler } = require("../config")
 const { isProduction } = require("../env")
 const jscommon = require("./jscommon")
 
-module.exports = loaderMatches(webpackLoader, "babel", () => ({
+export = loaderMatches(javascriptTranspiler, "babel", () => ({
   test: /\.(js|jsx|mjs|ts|tsx|coffee)?(\.erb)?$/,
   ...jscommon,
   use: [

data/package/rules/{coffee.js → coffee.ts}

@@ -1,6 +1,6 @@
 const { canProcess } = require("../utils/helpers")
 
-module.exports = canProcess("coffee-loader", (resolvedPath) => ({
+export = canProcess("coffee-loader", (resolvedPath: string) => ({
   test: /\.coffee(\.erb)?$/,
   use: [{ loader: resolvedPath }]
 }))

data/package/rules/css.ts

@@ -0,0 +1,3 @@
+const { getStyleRule } = require("../utils/getStyleRule")
+
+export = getStyleRule(/\.(css)$/i)

data/package/rules/{erb.js → erb.ts}

@@ -2,7 +2,7 @@ const { canProcess } = require("../utils/helpers")
 
 const runner = /^win/.test(process.platform) ? "ruby " : ""
 
-module.exports = canProcess("rails-erb-loader", (resolvedPath) => ({
+export = canProcess("rails-erb-loader", (resolvedPath: string) => ({
   test: /\.erb$/,
   enforce: "pre",
   exclude: /node_modules/,

data/package/rules/esbuild.ts

@@ -0,0 +1,10 @@
+const { loaderMatches } = require("../utils/helpers")
+const { getEsbuildLoaderConfig } = require("../esbuild")
+const { javascript_transpiler: javascriptTranspiler } = require("../config")
+const jscommon = require("./jscommon")
+
+export = loaderMatches(javascriptTranspiler, "esbuild", () => ({
+  test: /\.(ts|tsx|js|jsx|mjs|coffee)?(\.erb)?$/,
+  ...jscommon,
+  use: ({ resource }: { resource: string }) => getEsbuildLoaderConfig(resource)
+}))

data/package/rules/file.ts

@@ -0,0 +1,40 @@
+import { dirname, sep, normalize } from "path"
+const {
+  additional_paths: additionalPaths,
+  source_path: sourcePath
+} = require("../config")
+
+export = {
+  test: /\.(bmp|gif|jpe?g|png|tiff|ico|avif|webp|eot|otf|ttf|woff|woff2|svg)$/,
+  exclude: /\.(js|mjs|jsx|ts|tsx)$/,
+  type: "asset/resource",
+  generator: {
+    filename: (pathData: { filename?: string }) => {
+      // Guard against null/undefined pathData or filename
+      if (!pathData || !pathData.filename) {
+        return `static/[name]-[hash][ext][query]`
+      }
+      const path = normalize(dirname(pathData.filename))
+      const stripPaths = [...additionalPaths, sourcePath].map((p: string) =>
+        normalize(p)
+      )
+
+      const selectedStripPath = stripPaths.find((includePath: string) =>
+        path.startsWith(includePath)
+      )
+
+      if (!selectedStripPath) {
+        return `static/[name]-[hash][ext][query]`
+      }
+
+      // Split on both forward and backward slashes for cross-platform compatibility
+      const folders = path
+        .replace(selectedStripPath, "")
+        .split(/[\\/]/)
+        .filter(Boolean)
+
+      const foldersWithStatic = ["static", ...folders].join("/")
+      return `${foldersWithStatic}/[name]-[hash][ext][query]`
+    }
+  }
+}

data/package/rules/{jscommon.js → jscommon.ts}

@@ -1,11 +1,11 @@
-const { resolve } = require("path")
-const { realpathSync } = require("fs")
+import { resolve } from "path"
+import { realpathSync } from "fs"
 const {
   source_path: sourcePath,
   additional_paths: additionalPaths
 } = require("../config")
 
-const inclusions = [sourcePath, ...additionalPaths].map((p) => {
+const inclusions = [sourcePath, ...additionalPaths].map((p: string) => {
   try {
     return realpathSync(p)
   } catch (e) {
@@ -13,7 +13,7 @@ const inclusions = [sourcePath, ...additionalPaths].map((p) => {
   }
 })
 
-module.exports = {
+export = {
   include: inclusions,
   exclude: [
     {

data/package/rules/{less.js → less.ts}

@@ -1,19 +1,19 @@
-const path = require("path")
 const { canProcess } = require("../utils/helpers")
-const getStyleRule = require("../utils/getStyleRule")
+const { getStyleRule } = require("../utils/getStyleRule")
 
 const {
   additional_paths: paths,
   source_path: sourcePath
 } = require("../config")
 
-module.exports = canProcess("less-loader", (resolvedPath) =>
+export = canProcess("less-loader", (resolvedPath: string) =>
   getStyleRule(/\.(less)(\.erb)?$/i, [
     {
       loader: resolvedPath,
       options: {
         lessOptions: {
-          paths: [path.resolve(__dirname, "node_modules"), sourcePath, ...paths]
+          // Additional paths for Less imports (node_modules is resolved automatically)
+          paths: [sourcePath, ...paths]
         },
         sourceMap: true
       }

data/package/rules/raw.ts

@@ -0,0 +1,25 @@
+const config = require("../config")
+
+const rspackRawConfig = () => ({
+  resourceQuery: /raw/,
+  type: "asset/source"
+})
+
+const webpackRawConfig = () => ({
+  oneOf: [
+    {
+      // Match any file with ?raw query parameter
+      resourceQuery: /raw/,
+      type: "asset/source"
+    },
+    {
+      // Fallback: match .html files without query
+      test: /\.html$/,
+      exclude: /\.(js|mjs|jsx|ts|tsx)$/,
+      type: "asset/source"
+    }
+  ]
+})
+
+export =
+  config.assets_bundler === "rspack" ? rspackRawConfig() : webpackRawConfig()

data/package/rules/rspack.ts

@@ -0,0 +1,176 @@
+/* eslint global-require: 0 */
+
+const { moduleExists } = require("../utils/helpers")
+const { debug, info, warn } = require("../utils/debug")
+
+debug("Loading Rspack rules configuration...")
+
+const rules = []
+
+// Use Rspack's built-in SWC loader for JavaScript files
+debug("Adding JavaScript rule with builtin:swc-loader")
+rules.push({
+  test: /\.(js|jsx|mjs)$/,
+  exclude: /node_modules/,
+  // The 'type' field is required for Rspack to properly handle JavaScript modules
+  // when using builtin loaders. It ensures correct module parsing and transformation.
+  type: "javascript/auto",
+  use: [
+    {
+      loader: "builtin:swc-loader",
+      options: {
+        jsc: {
+          parser: {
+            syntax: "ecmascript",
+            jsx: true
+          },
+          transform: {
+            react: {
+              runtime: "automatic"
+            }
+          }
+        }
+      }
+    }
+  ]
+})
+
+// Use Rspack's built-in SWC loader for TypeScript files
+debug("Adding TypeScript rule with builtin:swc-loader")
+rules.push({
+  test: /\.(ts|tsx)$/,
+  exclude: /node_modules/,
+  // The 'type' field is required for Rspack to properly handle TypeScript modules
+  // when using builtin loaders. It ensures correct module parsing and transformation.
+  type: "javascript/auto",
+  use: [
+    {
+      loader: "builtin:swc-loader",
+      options: {
+        jsc: {
+          parser: {
+            syntax: "typescript",
+            tsx: true
+          },
+          transform: {
+            react: {
+              runtime: "automatic"
+            }
+          }
+        }
+      }
+    }
+  ]
+})
+
+// CSS rules using Rspack's built-in CSS handling
+debug("Checking for CSS loader...")
+if (moduleExists("css-loader")) {
+  debug("css-loader found, loading CSS rule configuration...")
+  const css = require("./css")
+  if (css) {
+    debug("Successfully added CSS rule")
+    rules.push(css)
+  } else {
+    warn("css-loader found but rule configuration returned null")
+  }
+} else {
+  info("Skipping CSS support - css-loader not installed")
+}
+
+// Sass rules
+debug("Checking for Sass loader...")
+if (moduleExists("sass") && moduleExists("sass-loader")) {
+  debug("sass and sass-loader found, loading Sass rule configuration...")
+  const sass = require("./sass")
+  if (sass) {
+    debug("Successfully added Sass rule")
+    rules.push(sass)
+  } else {
+    warn("sass and sass-loader found but rule configuration returned null")
+  }
+} else if (!moduleExists("sass")) {
+  info("Skipping Sass support - sass not installed")
+} else if (!moduleExists("sass-loader")) {
+  info("Skipping Sass support - sass-loader not installed")
+}
+
+// Less rules
+debug("Checking for Less loader...")
+if (moduleExists("less") && moduleExists("less-loader")) {
+  debug("less and less-loader found, loading Less rule configuration...")
+  const less = require("./less")
+  if (less) {
+    debug("Successfully added Less rule")
+    rules.push(less)
+  } else {
+    warn("less and less-loader found but rule configuration returned null")
+  }
+} else if (!moduleExists("less")) {
+  info("Skipping Less support - less not installed")
+} else if (!moduleExists("less-loader")) {
+  info("Skipping Less support - less-loader not installed")
+}
+
+// Stylus rules
+debug("Checking for Stylus loader...")
+if (moduleExists("stylus") && moduleExists("stylus-loader")) {
+  debug("stylus and stylus-loader found, loading Stylus rule configuration...")
+  const stylus = require("./stylus")
+  if (stylus) {
+    debug("Successfully added Stylus rule")
+    rules.push(stylus)
+  } else {
+    warn("stylus and stylus-loader found but rule configuration returned null")
+  }
+} else if (!moduleExists("stylus")) {
+  info("Skipping Stylus support - stylus not installed")
+} else if (!moduleExists("stylus-loader")) {
+  info("Skipping Stylus support - stylus-loader not installed")
+}
+
+// ERB template support
+debug("Checking for ERB template support...")
+const erb = require("./erb")
+
+if (erb) {
+  debug("Successfully added ERB rule")
+  rules.push(erb)
+} else {
+  info("Skipping ERB support - rails-erb-loader not installed")
+}
+
+// File/asset handling using Rspack's built-in asset modules
+// This is a critical rule required for proper asset handling
+debug("Adding file/asset handling rule...")
+const file = require("./file")
+
+if (!file) {
+  throw new Error(
+    "CRITICAL: file rule configuration returned null. " +
+      "Asset handling is required for proper bundling. " +
+      "Please ensure the file rule module exports a valid rule configuration."
+  )
+}
+
+debug("Successfully added file/asset rule")
+rules.push(file)
+
+// Raw file loading
+// This is a critical rule required for raw file imports
+debug("Adding raw file loading rule...")
+const raw = require("./raw")
+
+if (!raw) {
+  throw new Error(
+    "CRITICAL: raw rule configuration returned null. " +
+      "Raw file loading is required for proper bundling. " +
+      "Please ensure the raw rule module exports a valid rule configuration."
+  )
+}
+
+debug("Successfully added raw file rule")
+rules.push(raw)
+
+debug(`Rspack rules configuration complete. Total rules: ${rules.length}`)
+export = rules

data/package/rules/{sass.js → sass.ts}

@@ -1,17 +1,21 @@
 /* eslint global-require: 0 */
 
-const getStyleRule = require("../utils/getStyleRule")
+const { getStyleRule } = require("../utils/getStyleRule")
 const { canProcess, packageMajorVersion } = require("../utils/helpers")
 const { additional_paths: extraPaths } = require("../config")
 
-module.exports = canProcess("sass-loader", (resolvedPath) => {
+export = canProcess("sass-loader", (resolvedPath: string) => {
   const optionKey =
     packageMajorVersion("sass-loader") > 15 ? "loadPaths" : "includePaths"
   return getStyleRule(/\.(scss|sass)(\.erb)?$/i, [
     {
       loader: resolvedPath,
       options: {
-        sassOptions: { [optionKey]: extraPaths }
+        sourceMap: true,
+        sassOptions: {
+          [optionKey]: extraPaths,
+          quietDeps: true
+        }
       }
     }
   ])

data/package/rules/{stylus.js → stylus.ts}

@@ -1,23 +1,19 @@
-const path = require("path")
 const { canProcess } = require("../utils/helpers")
-const getStyleRule = require("../utils/getStyleRule")
+const { getStyleRule } = require("../utils/getStyleRule")
 
 const {
   additional_paths: paths,
   source_path: sourcePath
 } = require("../config")
 
-module.exports = canProcess("stylus-loader", (resolvedPath) =>
+export = canProcess("stylus-loader", (resolvedPath: string) =>
   getStyleRule(/\.(styl(us)?)(\.erb)?$/i, [
     {
       loader: resolvedPath,
       options: {
         stylusOptions: {
-          include: [
-            path.resolve(__dirname, "node_modules"),
-            sourcePath,
-            ...paths
-          ]
+          // Additional paths for Stylus imports (node_modules is resolved automatically)
+          include: [sourcePath, ...paths]
         },
         sourceMap: true
       }

data/package/rules/swc.ts

@@ -0,0 +1,10 @@
+const { loaderMatches } = require("../utils/helpers")
+const { getSwcLoaderConfig } = require("../swc")
+const { javascript_transpiler: javascriptTranspiler } = require("../config")
+const jscommon = require("./jscommon")
+
+export = loaderMatches(javascriptTranspiler, "swc", () => ({
+  test: /\.(ts|tsx|js|jsx|mjs|coffee)?(\.erb)?$/,
+  ...jscommon,
+  use: ({ resource }: { resource: string }) => getSwcLoaderConfig(resource)
+}))

data/package/rules/{index.js → webpack.ts}

@@ -1,7 +1,7 @@
 /* eslint global-require: 0 */
 /* eslint import/no-dynamic-require: 0 */
 
-module.exports = [
+export = [
   require("./raw"),
   require("./file"),
   require("./css"),

data/package/swc/index.ts

@@ -0,0 +1,54 @@
+/* eslint global-require: 0 */
+/* eslint import/no-dynamic-require: 0 */
+
+import { resolve } from "path"
+import { existsSync } from "fs"
+import { merge } from "webpack-merge"
+import type { RuleSetRule } from "webpack"
+
+const JSX_FILE_REGEX = /\.(jsx|tsx)(\.erb)?$/
+const TYPESCRIPT_FILE_REGEX = /\.(ts|tsx)(\.erb)?$/
+
+const isJsxFile = (filename: string): boolean => !!filename.match(JSX_FILE_REGEX)
+
+const isTypescriptFile = (filename: string): boolean => !!filename.match(TYPESCRIPT_FILE_REGEX)
+
+const getCustomConfig = (): Partial<RuleSetRule> => {
+  const path = resolve("config", "swc.config.js")
+  if (existsSync(path)) {
+    // eslint-disable-next-line @typescript-eslint/no-require-imports
+    return require(path)
+  }
+  return {}
+}
+
+const getSwcLoaderConfig = (filenameToProcess: string): RuleSetRule => {
+  const customConfig = getCustomConfig()
+  const isTs = isTypescriptFile(filenameToProcess)
+  const isJsx = isJsxFile(filenameToProcess)
+  const jsxKey = isTs ? "tsx" : "jsx"
+
+  const defaultConfig: RuleSetRule = {
+    loader: require.resolve("swc-loader"),
+    options: {
+      jsc: {
+        parser: {
+          dynamicImport: true,
+          syntax: isTs ? "typescript" : "ecmascript",
+          [jsxKey]: isJsx
+        },
+        loose: true
+      },
+      sourceMaps: true,
+      env: {
+        coreJs: 3,
+        exclude: ["transform-typeof-symbol"],
+        mode: "entry"
+      }
+    }
+  }
+
+  return merge(defaultConfig, customConfig)
+}
+
+export { getSwcLoaderConfig }