fix(angular-rspack): sass-loader should not be required when using css (#32)

* fix(angular-rspack): sass-loader should not be required when using css

* fix(angular-rspack): sass-loader should not be required when using css

Author: Coly010

package.json

@@ -65,6 +65,7 @@
     "@vitest/ui": "^1.3.1",
     "angular-eslint": "^19.0.2",
     "commitlint-plugin-tense": "1.0.4",
+    "css-loader": "^7.1.2",
     "eslint": "^9.8.0",
     "eslint-config-prettier": "^9.0.0",
     "eslint-plugin-playwright": "^1.6.2",

packages/angular-rspack/eslint.next.config.js

@@ -24,6 +24,7 @@ module.exports = [
           ],
           ignoredDependencies: [
             'nx',
+            'css-loader',
             'less-loader',
             'sass-loader',
             'sass-embedded',

packages/angular-rspack/package.json

@@ -54,6 +54,7 @@
     "license-webpack-plugin": "^4.0.2",
     "sass-embedded": "^1.79.3",
     "sass-loader": "^16.0.2",
+    "css-loader": "^7.1.2",
     "tslib": "^2.3.0",
     "webpack-merge": "^6.0.1",
     "ws": "^8.18.0"

packages/angular-rspack/src/lib/config/style-config-utils.ts

@@ -18,7 +18,7 @@ export function getSassLoaderConfig(
   sourceMap?: SourceMap
 ) {
   return {
-    test: /\.?(sa|sc|c)ss$/,
+    test: /\.?(sa|sc)ss$/,
     use: [
       {
         loader: 'sass-loader',

packages/angular-rspack/src/lib/config/style-config-utils.unit.test.ts

@@ -43,7 +43,7 @@ describe('getIncludePathOptions', () => {
 describe('getSassLoaderConfig', () => {
   it('should return sass loader config without options passed', () => {
     expect(getSassLoaderConfig()).toStrictEqual({
-      test: /\.?(sa|sc|c)ss$/,
+      test: /\.?(sa|sc)ss$/,
       use: [
         {
           loader: 'sass-loader',
@@ -127,7 +127,7 @@ describe('getStyleLoaders', () => {
   it('should return sass and less loader config without options passed', () => {
     expect(getStyleLoaders()).toStrictEqual([
       {
-        test: /\.?(sa|sc|c)ss$/,
+        test: /\.?(sa|sc)ss$/,
         use: [
           {
             loader: 'sass-loader',
@@ -162,26 +162,28 @@ describe('getStyleLoaders', () => {
         includePaths: ['path/to/a'],
         sass: { indentedSyntax: true },
       })
-    ).toStrictEqual([
-      expect.objectContaining({
-        use: [
-          expect.objectContaining({
-            options: expect.objectContaining({
-              includePaths: ['path/to/a'],
-              indentedSyntax: true,
+    ).toStrictEqual(
+      expect.arrayContaining([
+        expect.objectContaining({
+          use: [
+            expect.objectContaining({
+              options: expect.objectContaining({
+                includePaths: ['path/to/a'],
+                indentedSyntax: true,
+              }),
             }),
-          }),
-        ],
-      }),
-      expect.objectContaining({
-        use: [
-          expect.objectContaining({
-            options: expect.objectContaining({
-              paths: ['path/to/a'],
+          ],
+        }),
+        expect.objectContaining({
+          use: [
+            expect.objectContaining({
+              options: expect.objectContaining({
+                paths: ['path/to/a'],
+              }),
             }),
-          }),
-        ],
-      }),
-    ]);
+          ],
+        }),
+      ])
+    );
   });
 });