rspack
                                
                                 rspack copied to clipboard
                                
                                    rspack copied to clipboard
                            
                            
                            
                        [Bug]: Chunks hashes calculated with errors
System Info
System: OS: macOS 15.0 CPU: (10) arm64 Apple M1 Pro Memory: 139.61 MB / 16.00 GB Shell: 5.9 - /bin/zsh Binaries: Node: 20.16.0 - ~/.nvm/versions/node/v20.16.0/bin/node Yarn: 1.22.19 - /opt/homebrew/bin/yarn npm: 10.8.1 - ~/.nvm/versions/node/v20.16.0/bin/npm Browsers: Chrome: 128.0.6613.138 Firefox: 128.0.2 Safari: 18.0
Details
After build some files dosen't change his hashes, but links to builded files changed.
Sorry for bad quality. It's our user's screenshot
Rspack trying to request chunk /js/5488.undefined.js. But this chunk broken.
I think it's because rspack not change file hash if change only link to another chunk (i don't know how it works, perceive link as abstraction)
(comparison of two chunks with same names between different builds)
webpack build normally.
rspack.config.ts
import { defineConfig } from '@rspack/cli';
import { rspack } from '@rspack/core';
import RefreshPlugin from '@rspack/plugin-react-refresh';
import path from 'path';
import dotenv from 'dotenv';
import { RsdoctorRspackPlugin } from '@rsdoctor/rspack-plugin';
import HtmlRspackPlugin from 'html-rspack-plugin';
dotenv.config({ path: './.env.local' });
const isDev = process.env.NODE_ENV === 'development';
const APP_NAME = 'Secret';
const COOKIE_BACKEND_HOST = process.env.COOKIE_BACKEND_HOST;
const DEBUG_HOST = 'localhost';
const DEBUG_PORT = process.env.PORT || '8086';
const BASE_URL = process.env.BASE_URL || '/api';
const DEV_PROXY = process.env.REACT_APP_API_BASE_URL;
const JSON_ENV_URL = process.env.JSON_ENV_URL || '/config.json';
const FAVICON_PATH = path.resolve(__dirname, 'src', 'assets', 'favicon.ico');
const ALLOW_ANALYTICS = Boolean(process.env.ALLOW_ANALYTICS);
// Target browsers, see: https://github.com/browserslist/browserslist
const targets = ['chrome >= 87', 'edge >= 88', 'firefox >= 78', 'safari >= 14'];
export default defineConfig({
  output: {
    path: path.resolve(__dirname, 'dist'),
    publicPath: '/',
    filename: `js/[name].[${isDev ? 'fullhash' : 'contenthash'}].bundle.js`,
    chunkFilename: 'js/[name].[chunkhash:8].js',
    clean: true,
  },
  devtool: isDev ? 'source-map' : false,
  experiments: {
    css: true,
  },
  context: __dirname,
  entry: {
    main: './src/app/index.tsx',
  },
  resolve: {
    extensions: ['...', '.ts', '.tsx', '.jsx'],
    tsConfig: {
      configFile: path.resolve(__dirname, 'tsconfig.json'),
    },
  },
  module: {
    rules: [
      {
        test: /\.(jsx?|tsx?)$/,
        use: [
          {
            loader: 'builtin:swc-loader',
            options: {
              jsc: {
                experimental: {
                  plugins: [
                    [
                      '@swc/plugin-styled-components',
                      {
                        displayName: true,
                        ssr: false,
                      },
                    ],
                  ],
                },
                parser: {
                  syntax: 'typescript',
                  tsx: true,
                },
                transform: {
                  react: {
                    runtime: 'automatic',
                    development: isDev,
                    refresh: isDev,
                  },
                },
              },
              env: { targets },
            },
          },
        ],
      },
      {
        test: /\.(png|svg|jpg|jpeg|gif)$/,
        type: 'asset/resource',
      },
      {
        test: /\.(woff|woff2|eot|ttf|otf)$/i,
        type: 'asset/resource',
      },
    ],
  },
  plugins: [
    new rspack.DefinePlugin({
      env: { JSON_ENV_URL: JSON.stringify(JSON_ENV_URL) },
      webpack: {
        isProduction: !isDev,
      },
    }),
    new HtmlRspackPlugin({
      template: './src/index.html',
      inject: 'body',
      templateParameters: {
        title:
          APP_NAME ||
          'You should use variable APP_NAME in rspack.config.ts for your project',
        appConfigFilePath: JSON_ENV_URL,
      },
      favicon: (FAVICON_PATH && path.resolve(__dirname, FAVICON_PATH)) || '',
    }),
    new rspack.CopyRspackPlugin({
      patterns: [{ from: 'public', to: '', noErrorOnMissing: true }],
    }),
    isDev && new RefreshPlugin(),
    ALLOW_ANALYTICS &&
      new RsdoctorRspackPlugin({
        // plugin options
      }),
  ].filter(Boolean),
  optimization: {
    minimizer: [
      new rspack.SwcJsMinimizerRspackPlugin(),
      new rspack.LightningCssMinimizerRspackPlugin({
        minimizerOptions: { targets },
      }),
    ],
    runtimeChunk: isDev ? 'single' : 'multiple',
    splitChunks: {
      chunks: 'all',
      cacheGroups: {
        defaultVendors: {
          test: /[\\/]node_modules[\\/]/,
          idHint: 'vendors',
          priority: -1,
          reuseExistingChunk: true,
        },
      },
    },
  },
  devServer: {
    setupMiddlewares: (middlewares, devServer) => {
      if (!devServer) {
        throw new Error('webpack-dev-server is not defined');
      }
      const { SMART_CAPTCHA_SITE_KEY, FEATURE_FLAG_V2_THEME, BASE_URL } =
        process.env;
      devServer?.app?.get(JSON_ENV_URL, (_, response) => {
        response.send(
          JSON.stringify({
            SMART_CAPTCHA_SITE_KEY,
            FEATURE_FLAG_V2_THEME,
            BASE_URL,
          }),
        );
      });
      return middlewares;
    },
    host: DEBUG_HOST,
    port: DEBUG_PORT,
    static: path.resolve(__dirname, 'dist'),
    historyApiFallback: true,
    proxy: [
      {
        context: [BASE_URL],
        target: DEV_PROXY,
        changeOrigin: true,
        secure: false,
        onProxyReq: (proxyReq) => {
          // CSRF bypass
          proxyReq.setHeader('referer', DEV_PROXY as string);
        },
        cookieDomainRewrite: {
          [COOKIE_BACKEND_HOST as string]: DEBUG_HOST,
        },
      },
    ],
  },
});
Reproduce link
No response
Reproduce Steps
- Run build
- Modify code in connected chunk
- Run build again
- ????
- One chunk has the same name