shakapacker 8.4.0 → 9.0.0.beta.0

data/lib/install/bin/shakapacker-rspack

@@ -0,0 +1,13 @@
+#!/usr/bin/env ruby
+
+ENV["RAILS_ENV"] ||= "development"
+ENV["BUNDLE_GEMFILE"] ||= File.expand_path("../../Gemfile", __FILE__)
+
+require "bundler/setup"
+require "shakapacker"
+require "shakapacker/rspack_runner"
+
+APP_ROOT = File.expand_path("..", __dir__)
+Dir.chdir(APP_ROOT) do
+  Shakapacker::RspackRunner.run(ARGV)
+end

data/lib/install/config/rspack/rspack.config.js

@@ -0,0 +1,6 @@
+// See the shakacode/shakapacker README and docs directory for advice on customizing your rspackConfig.
+const { generateRspackConfig } = require('shakapacker/rspack')
+
+const rspackConfig = generateRspackConfig()
+
+module.exports = rspackConfig

data/lib/install/config/shakapacker.yml

@@ -39,6 +39,9 @@ default: &default
   # Select loader to use, available options are 'babel' (default), 'swc' or 'esbuild'
   webpack_loader: 'babel'
 
+  # Select bundler to use, available options are 'webpack' (default) or 'rspack'
+  bundler: 'webpack'
+
   # Raises an error if there is a mismatch in the shakapacker gem and npm package being used
   ensure_consistent_versioning: true
 

data/lib/install/package.json

@@ -0,0 +1,30 @@
+{
+  "rspack": {
+    "@rspack/cli": "^1.0.0",
+    "@rspack/core": "^1.0.0",
+    "rspack-manifest-plugin": "^5.0.0"
+  },
+  "webpack": {
+    "mini-css-extract-plugin": "^2.0.0",
+    "terser-webpack-plugin": "^5.3.1",
+    "webpack": "^5.76.0",
+    "webpack-assets-manifest": "^5.0.6 || ^6.0.0",
+    "webpack-cli": "^4.9.2 || ^5.0.0 || ^6.0.0",
+    "webpack-dev-server": "^4.15.2 || ^5.2.2",
+    "webpack-merge": "^5.8.0 || ^6.0.0",
+    "webpack-subresource-integrity": "^5.1.0"
+  },
+  "common": {
+    "compression-webpack-plugin": "^9.0.0 || ^10.0.0|| ^11.0.0",
+    "css-loader": "^6.0.0 || ^7.0.0",
+    "sass-loader": "^13.0.0 || ^14.0.0 || ^15.0.0 || ^16.0.0",
+    "style-loader": "^3.0.0 || ^4.0.0"
+  },
+  "babel": {
+    "@babel/core": "^7.17.9",
+    "@babel/plugin-transform-runtime": "^7.17.0",
+    "@babel/preset-env": "^7.16.11",
+    "@babel/runtime": "^7.17.9",
+    "babel-loader": "^8.2.4 || ^9.0.0 || ^10.0.0"
+  }
+}

data/lib/install/template.rb

@@ -8,7 +8,6 @@ require "package_json"
 force_option = ENV["FORCE"] ? { force: true } : {}
 
 copy_file "#{__dir__}/config/shakapacker.yml", "config/shakapacker.yml", force_option
-remove_file "#{__dir__}/package.json" if force_option[:force]
 
 say "Copying webpack core config"
 directory "#{__dir__}/config/webpack", "config/webpack", force_option
@@ -112,7 +111,15 @@ rescue PackageJson::Error
 end
 
 def fetch_peer_dependencies
-  PackageJson.read("#{__dir__}/../../").fetch("peerDependencies")
+  PackageJson.read("#{__dir__}").fetch(ENV["SHAKAPACKER_BUNDLER"] || "webpack")
+end
+
+def fetch_common_dependencies
+  ENV["SKIP_COMMON_LOADERS"] ? {} : PackageJson.read("#{__dir__}").fetch("common")
+end
+
+def fetch_babel_dependencies
+  ENV["USE_BABEL_PACKAGES"] ? PackageJson.read("#{__dir__}").fetch("babel") : {}
 end
 
 Dir.chdir(Rails.root) do
@@ -130,6 +137,9 @@ Dir.chdir(Rails.root) do
   end
 
   peers = fetch_peer_dependencies
+  peers = peers.merge(fetch_common_dependencies)
+  peers = peers.merge(fetch_babel_dependencies)
+
   dev_dependency_packages = ["webpack-dev-server"]
 
   dependencies_to_add = []

data/lib/shakapacker/configuration.rb

@@ -88,6 +88,18 @@ class Shakapacker::Configuration
     fetch(:compiler_strategy)
   end
 
+  def bundler
+    fetch(:bundler) || "webpack"
+  end
+
+  def rspack?
+    bundler == "rspack"
+  end
+
+  def webpack?
+    bundler == "webpack"
+  end
+
   def fetch(key)
     data.fetch(key, defaults[key])
   end

data/lib/shakapacker/dev_server_runner.rb

@@ -75,12 +75,20 @@ module Shakapacker
           env["NODE_OPTIONS"] = "#{env["NODE_OPTIONS"]} --inspect-brk --trace-warnings"
         end
 
-        cmd += ["--config", @webpack_config]
-        cmd += ["--progress", "--color"] if @pretty
-
-        # Default behavior of webpack-dev-server is @hot = true
-        cmd += ["--hot", "only"] if @hot == "only"
-        cmd += ["--no-hot"] if !@hot
+        # Add bundler-specific flags and config
+        bundler = get_bundler_type
+        if bundler == "webpack"
+          cmd += ["--config", @webpack_config]
+          cmd += ["--progress", "--color"] if @pretty
+          # Default behavior of webpack-dev-server is @hot = true
+          cmd += ["--hot", "only"] if @hot == "only"
+          cmd += ["--no-hot"] if !@hot
+        elsif bundler == "rspack"
+          # Only add config for rspack if it's not a rspack-specific command
+          cmd += ["--config", @webpack_config]
+          # Rspack supports --hot but not --no-hot or --progress/--color
+          cmd += ["--hot"] if @hot && @hot != false
+        end
 
         cmd += @argv
 
@@ -90,7 +98,9 @@ module Shakapacker
       end
 
       def build_cmd
-        package_json.manager.native_exec_command("webpack", ["serve"])
+        bundler = get_bundler_type
+        command = bundler == "rspack" ? "rspack" : "webpack"
+        package_json.manager.native_exec_command(command, ["serve"])
       end
   end
 end

data/lib/shakapacker/manifest.rb

@@ -114,9 +114,10 @@ Shakapacker can't find #{bundle_name} in #{config.manifest_path}. Possible cause
 2. Your app has code with a non-standard extension (like a `.jsx` file) but the extension is not in the `extensions` config in `config/shakapacker.yml`
 3. You have set compile: false (see `config/shakapacker.yml`) for this environment
    (unless you are using the `bin/shakapacker -w` or the `bin/shakapacker-dev-server`, in which case maybe you aren't running the dev server in the background?)
-4. webpack has not yet FINISHED running to reflect updates.
+4. Your bundler (webpack/rspack) has not yet FINISHED running to reflect updates.
 5. You have misconfigured Shakapacker's `config/shakapacker.yml` file.
-6. Your webpack configuration is not creating a manifest.
+6. Your bundler configuration is not creating a manifest with the expected structure.
+7. There's a mismatch between your bundler choice (webpack vs rspack) and the manifest format.
 
 Your manifest contains:
 #{JSON.pretty_generate(@data)}

data/lib/shakapacker/rspack_runner.rb

@@ -0,0 +1,57 @@
+require "shellwords"
+
+require_relative "runner"
+
+module Shakapacker
+  class RspackRunner < Shakapacker::Runner
+    RSPACK_COMMANDS = [
+      "help",
+      "h",
+      "--help",
+      "-h",
+      "version",
+      "v",
+      "--version",
+      "-v",
+      "info",
+      "i"
+    ].freeze
+
+    def run
+      env = Shakapacker::Compiler.env
+      env["SHAKAPACKER_CONFIG"] = @shakapacker_config
+      env["NODE_OPTIONS"] = ENV["NODE_OPTIONS"] || ""
+
+      cmd = build_cmd
+
+      if @argv.delete("--debug-shakapacker")
+        env["NODE_OPTIONS"] = "#{env["NODE_OPTIONS"]} --inspect-brk"
+      end
+
+      if @argv.delete "--trace-deprecation"
+        env["NODE_OPTIONS"] = "#{env["NODE_OPTIONS"]} --trace-deprecation"
+      end
+
+      if @argv.delete "--no-deprecation"
+        env["NODE_OPTIONS"] = "#{env["NODE_OPTIONS"]} --no-deprecation"
+      end
+
+      # Rspack commands are not compatible with --config option.
+      if (@argv & RSPACK_COMMANDS).empty?
+        cmd += ["--config", @webpack_config]
+      end
+
+      cmd += @argv
+
+      Dir.chdir(@app_path) do
+        Kernel.exec env, *cmd
+      end
+    end
+
+    private
+
+      def build_cmd
+        package_json.manager.native_exec_command("rspack")
+      end
+  end
+end

data/lib/shakapacker/runner.rb

@@ -1,7 +1,9 @@
 require_relative "utils/misc"
 require_relative "utils/manager"
+require_relative "configuration"
 
 require "package_json"
+require "pathname"
 
 module Shakapacker
   class Runner
@@ -16,7 +18,12 @@ module Shakapacker
 
       @app_path              = File.expand_path(".", Dir.pwd)
       @shakapacker_config    = ENV["SHAKAPACKER_CONFIG"] || File.join(@app_path, "config/shakapacker.yml")
-      @webpack_config        = find_webpack_config
+      @config                = Configuration.new(
+        root_path: Pathname.new(@app_path),
+        config_path: Pathname.new(@shakapacker_config),
+        env: ENV["RAILS_ENV"] || ENV["NODE_ENV"] || "development"
+      )
+      @webpack_config        = find_bundler_config
 
       Shakapacker::Utils::Manager.error_unless_package_manager_is_obvious!
     end
@@ -26,6 +33,45 @@ module Shakapacker
     end
 
     private
+      def find_bundler_config
+        if @config.rspack?
+          find_rspack_config_with_fallback
+        else
+          find_webpack_config
+        end
+      end
+
+      def get_bundler_type
+        @config.bundler
+      end
+
+      def find_rspack_config_with_fallback
+        # First try rspack-specific paths
+        rspack_paths = %w[ts js].map do |ext|
+          File.join(@app_path, "config/rspack/rspack.config.#{ext}")
+        end
+
+        rspack_path = rspack_paths.find { |f| File.exist?(f) }
+        return rspack_path if rspack_path
+
+        # Fallback to webpack config with deprecation warning
+        webpack_paths = %w[ts js].map do |ext|
+          File.join(@app_path, "config/webpack/webpack.config.#{ext}")
+        end
+
+        webpack_path = webpack_paths.find { |f| File.exist?(f) }
+        if webpack_path
+          $stderr.puts "⚠️  DEPRECATION WARNING: Using webpack config file for Rspack bundler."
+          $stderr.puts "   Please create config/rspack/rspack.config.js and migrate your configuration."
+          $stderr.puts "   Using: #{webpack_path}"
+          return webpack_path
+        end
+
+        # No config found
+        $stderr.puts "rspack config #{rspack_paths.last} not found, please run 'bundle exec rails shakapacker:install' to install Shakapacker with default configs or create the missing config file."
+        exit(1)
+      end
+
       def find_webpack_config
         possible_paths = %w[ts js].map do |ext|
           File.join(@app_path, "config/webpack/webpack.config.#{ext}")
@@ -33,7 +79,7 @@ module Shakapacker
         path = possible_paths.find { |f| File.exist?(f) }
         unless path
           $stderr.puts "webpack config #{possible_paths.last} not found, please run 'bundle exec rails shakapacker:install' to install Shakapacker with default configs or add the missing config file for your custom environment."
-          exit!
+          exit(1)
         end
         path
       end

data/lib/shakapacker/version.rb

@@ -1,4 +1,4 @@
 module Shakapacker
   # Change the version in package.json too, please!
-  VERSION = "8.4.0".freeze
+  VERSION = "9.0.0.beta.0".freeze
 end

data/package/environments/base.js

@@ -1,16 +1,20 @@
 /* eslint global-require: 0 */
 /* eslint import/no-dynamic-require: 0 */
 
-const { existsSync, readdirSync } = require("fs")
 const { basename, dirname, join, relative, resolve } = require("path")
+const { existsSync, readdirSync } = require("fs")
 const extname = require("path-complete-extname")
-// TODO: Change to `const { WebpackAssetsManifest }` when dropping 'webpack-assets-manifest < 6.0.0' (Node >=20.10.0) support
-const WebpackAssetsManifest = require("webpack-assets-manifest")
-const webpack = require("webpack")
-const rules = require("../rules")
 const config = require("../config")
 const { isProduction } = require("../env")
-const { moduleExists } = require("../utils/helpers")
+
+const pluginsPath = resolve(__dirname, "..", "plugins", `${config.bundler}.js`)
+const { getPlugins } = require(pluginsPath)
+const rulesPath = resolve(__dirname, "..", "rules", `${config.bundler}.js`)
+const rules = require(rulesPath)
+
+// Don't use contentHash except for production for performance
+// https://webpack.js.org/guides/build-performance/#avoid-production-specific-tooling
+const hash = isProduction || config.useContentHash ? "-[contenthash]" : ""
 
 const getFilesInDirectory = (dir, includeNested) => {
   if (!existsSync(dir)) {
@@ -73,63 +77,6 @@ const getModulePaths = () => {
   return result
 }
 
-// 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 getPlugins = () => {
-  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 = require("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.
-        // Read: https://stackoverflow.com/questions/51971857/mini-css-extract-plugin-warning-in-chunk-chunkname-mini-css-extract-plugin-con
-        ignoreOrder: config.css_extract_ignore_order_warnings
-      })
-    )
-  }
-
-  if (
-    moduleExists("webpack-subresource-integrity") &&
-    config.integrity.enabled
-  ) {
-    const {
-      SubresourceIntegrityPlugin
-    } = require("webpack-subresource-integrity")
-
-    plugins.push(
-      new SubresourceIntegrityPlugin({
-        hashFuncNames: config.integrity.hash_functions,
-        enabled: isProduction
-      })
-    )
-  }
-
-  return plugins
-}
-
-// Don't use contentHash except for production for performance
-// https://webpack.js.org/guides/build-performance/#avoid-production-specific-tooling
-const hash = isProduction || config.useContentHash ? "-[contenthash]" : ""
-
 module.exports = {
   mode: "production",
   output: {
@@ -160,12 +107,10 @@ module.exports = {
 
   optimization: {
     splitChunks: { chunks: "all" },
-
     runtimeChunk: "single"
   },
 
   module: {
-    strictExportPresence: true,
     rules
   }
 }

data/package/environments/development.js

@@ -1,13 +1,28 @@
 const { merge } = require("webpack-merge")
-
+const config = require("../config")
 const baseConfig = require("./base")
 const webpackDevServerConfig = require("../webpackDevServerConfig")
 const { runningWebpackDevServer } = require("../env")
 
-const devConfig = {
+const webpackDevConfig = {
   mode: "development",
   devtool: "cheap-module-source-map",
   ...(runningWebpackDevServer && { devServer: webpackDevServerConfig() })
 }
 
-module.exports = merge(baseConfig, devConfig)
+const rspackDevConfig = {
+  mode: "development",
+  devtool: "cheap-module-source-map",
+  // Force writing assets to disk in development for Rails compatibility
+  devServer: {
+    ...webpackDevServerConfig(),
+    devMiddleware: {
+      writeToDisk: true
+    }
+  }
+}
+
+const bundlerConfig =
+  config.bundler === "rspack" ? rspackDevConfig : webpackDevConfig
+
+module.exports = merge(baseConfig, bundlerConfig)

data/package/environments/production.js

@@ -2,46 +2,44 @@
 /* eslint import/no-dynamic-require: 0 */
 
 const { merge } = require("webpack-merge")
-const CompressionPlugin = require("compression-webpack-plugin")
-const TerserPlugin = require("terser-webpack-plugin")
+const { resolve } = require("path")
 const baseConfig = require("./base")
 const { moduleExists } = require("../utils/helpers")
 const config = require("../config")
 
+const path = resolve(__dirname, "..", "optimization", `${config.bundler}.js`)
+const { getOptimization } = require(path)
+
+let CompressionPlugin = null
+if (moduleExists("compression-webpack-plugin")) {
+  // eslint-disable-next-line global-require
+  CompressionPlugin = require("compression-webpack-plugin")
+}
+
 const getPlugins = () => {
   const plugins = []
 
-  plugins.push(
-    new CompressionPlugin({
-      filename: "[path][base].gz[query]",
-      algorithm: "gzip",
-      test: /\.(js|css|html|json|ico|svg|eot|otf|ttf|map)$/
-    })
-  )
-
-  if ("brotli" in process.versions) {
+  if (CompressionPlugin) {
     plugins.push(
       new CompressionPlugin({
-        filename: "[path][base].br[query]",
-        algorithm: "brotliCompress",
+        filename: "[path][base].gz[query]",
+        algorithm: "gzip",
         test: /\.(js|css|html|json|ico|svg|eot|otf|ttf|map)$/
       })
     )
-  }
 
-  return plugins
-}
-
-const tryCssMinimizer = () => {
-  if (
-    moduleExists("css-loader") &&
-    moduleExists("css-minimizer-webpack-plugin")
-  ) {
-    const CssMinimizerPlugin = require("css-minimizer-webpack-plugin")
-    return new CssMinimizerPlugin()
+    if ("brotli" in process.versions) {
+      plugins.push(
+        new CompressionPlugin({
+          filename: "[path][base].br[query]",
+          algorithm: "brotliCompress",
+          test: /\.(js|css|html|json|ico|svg|eot|otf|ttf|map)$/
+        })
+      )
+    }
   }
 
-  return null
+  return plugins
 }
 
 const productionConfig = {
@@ -49,32 +47,7 @@ const productionConfig = {
   stats: "normal",
   bail: true,
   plugins: getPlugins(),
-  optimization: {
-    minimizer: [
-      tryCssMinimizer(),
-      new TerserPlugin({
-        parallel: Number.parseInt(process.env.SHAKAPACKER_PARALLEL, 10) || true,
-        terserOptions: {
-          parse: {
-            // Let terser parse ecma 8 code but always output
-            // ES5 compliant code for older browsers
-            ecma: 8
-          },
-          compress: {
-            ecma: 5,
-            warnings: false,
-            comparisons: false
-          },
-          mangle: { safari10: true },
-          output: {
-            ecma: 5,
-            comments: false,
-            ascii_only: true
-          }
-        }
-      })
-    ].filter(Boolean)
-  }
+  optimization: getOptimization()
 }
 
 if (config.useContentHash === false) {

data/package/environments/test.js

@@ -1,3 +1,17 @@
+const { merge } = require("webpack-merge")
+const config = require("../config")
 const baseConfig = require("./base")
 
-module.exports = baseConfig
+const rspackTestConfig = {
+  mode: "development",
+  devtool: "cheap-module-source-map",
+  // Disable file watching in test mode
+  watchOptions: {
+    ignored: /node_modules/
+  }
+}
+
+const bundlerConfig =
+  config.bundler === "rspack" ? rspackTestConfig : baseConfig
+
+module.exports = merge(baseConfig, bundlerConfig)

data/package/index.d.ts

@@ -81,6 +81,20 @@ declare module 'shakapacker' {
   export * from 'webpack-merge'
 }
 
+declare module 'shakapacker/rspack' {
+  import type { RspackOptions, RuleSetRule } from '@rspack/core'
+  
+  export const config: Config
+  export function generateRspackConfig(extraConfig?: RspackOptions): RspackOptions
+  export const baseConfig: RspackOptions
+  export const env: Env
+  export const rules: RuleSetRule[]
+  export function moduleExists(packageName: string): boolean
+  export function canProcess<T = unknown>(rule: string, fn: (modulePath: string) => T): T | null
+  export const inliningCss: boolean
+  export * from 'webpack-merge'
+}
+
 declare module 'shakapacker/package/babel/preset.js' {
   import { ConfigAPI, PluginItem, TransformOptions } from '@babel/core'
 

data/package/index.js

@@ -4,9 +4,11 @@
 const webpackMerge = require("webpack-merge")
 const { resolve } = require("path")
 const { existsSync } = require("fs")
-const baseConfig = require("./environments/base")
-const rules = require("./rules")
 const config = require("./config")
+const baseConfig = require("./environments/base")
+
+const rulesPath = resolve(__dirname, "rules", `${config.bundler}.js`)
+const rules = require(rulesPath)
 const devServer = require("./dev_server")
 const env = require("./env")
 const { moduleExists, canProcess } = require("./utils/helpers")

data/package/optimization/rspack.js

@@ -0,0 +1,25 @@
+const { requireOrError } = require("../utils/requireOrError")
+
+const { rspack } = requireOrError("@rspack/core")
+
+const getOptimization = () => {
+  // Use Rspack's built-in minification instead of terser-webpack-plugin
+  const result = { minimize: true }
+  try {
+    result.minimizer = [
+      new rspack.SwcJsMinimizerRspackPlugin(),
+      new rspack.LightningCssMinimizerRspackPlugin()
+    ]
+  } catch (error) {
+    // eslint-disable-next-line no-console
+    console.warn(
+      "[SHAKAPACKER]: Warning: Could not configure Rspack minimizers:",
+      error.message
+    )
+  }
+  return result
+}
+
+module.exports = {
+  getOptimization
+}