[Bug]: CSS Loading Order Regression: Mixed `import` and `require` Statements

[Themezv]

System Info

Doesn't matter

Description

A regression in CSS loading order was introduced in Rspack 1.6.7 when mixing import and require statements for CSS files in the same module.

Expected Behavior

CSS files should be loaded in the order they appear in the source code, regardless of whether they are imported using import or require statements.

Actual Behavior

From Rspack 1.6.7, the CSS loading order is reversed when mixing import and require statements, causing styles to be applied in the wrong order.

Steps to Reproduce

1. Create a module that imports CSS files using both import and require:

import './App.css';
require('./App2.css');

function App() {
  return (
    <div className="App">
      <div>first</div>
      <div>second</div>
    </div>
  );
}

export default App;

2. Define conflicting styles in both CSS files:

App.css:

.App {
  display: flex;
  flex-direction: column;
}

App2.css:

.App {
  display: flex;
  flex-direction: row;
}

3. Build with Rspack 1.6.6 - CSS order matches import order (App.css first, then App2.css)
4. Build with Rspack 1.6.7+ - CSS order is reversed (App2.css first, then App.css)

Observed Behavior

Rspack 1.6.6 (Correct)

The generated CSS maintains the import order:

.App {
  display: flex;
  flex-direction: column;
}
.App {
    display: flex;
    flex-direction: row;
  }

Rspack 1.6.7+ (Incorrect)

The generated CSS has reversed order:

.App {
    display: flex;
    flex-direction: row;
  }
.App {
  display: flex;
  flex-direction: column;
}

Impact

This regression breaks CSS specificity expectations when mixing import and require statements, as the final styles applied depend on the order in which CSS rules appear in the generated bundle. This can cause unexpected styling behavior in applications that rely on the import order for CSS precedence.

Reproduce link

https://github.com/Themezv/rspack-css-order-mixed-import

Reproduce Steps

1. Run pnpm i
2. pnpm run dev (reproducing for production bundle too)
3. Open page and check css file

Change rspack version and run again