test: more

src/utils.js

@@ -454,8 +454,6 @@ function getWebpackResolver(
   };
 }
 
-const matchCss = /\.css$/i;
-
 function getWebpackImporter(loaderContext, implementation, includePaths) {
   const resolve = getWebpackResolver(
     loaderContext.getResolve,
@@ -467,12 +465,31 @@ function getWebpackImporter(loaderContext, implementation, includePaths) {
   return (originalUrl, prev, done) => {
     resolve(prev, originalUrl)
       .then((result) => {
+        let normalizedResult = path.normalize(result);
+
         // Add the result as dependency.
         // Although we're also using stats.includedFiles, this might come in handy when an error occurs.
         // In this case, we don't get stats.includedFiles from node-sass/sass.
-        loaderContext.addDependency(path.normalize(result));
-        // By removing the CSS file extension, we trigger node-sass to include the CSS file instead of just linking it.
-        done({ file: result.replace(matchCss, "") });
+        loaderContext.addDependency(normalizedResult);
+
+        const extension = path.extname(normalizedResult);
+
+        if (extension.toLowerCase() === ".css") {
+          // By removing the CSS file extension, we trigger node-sass to include the CSS file instead of just linking it.
+          normalizedResult = normalizedResult.replace(/\.css$/i, "");
+        } else {
+          // Allows `dart-sass` to resolve `.import` files
+          const basename = path.basename(normalizedResult, extension);
+
+          if (path.extname(basename) === ".import") {
+            normalizedResult = normalizedResult.replace(
+              new RegExp(`.import${extension}$`),
+              extension
+            );
+          }
+        }
+
+        done({ file: normalizedResult });
       })
       // Catch all resolving errors, return the original file and pass responsibility back to other custom importers
       .catch(() => {

test/__snapshots__/loader.test.js.snap

@@ -120,6 +120,24 @@ exports[`loader should load only sass/scss files for the "mainFiles" (node-sass)
 
 exports[`loader should load only sass/scss files for the "mainFiles" (node-sass) (scss): warnings 1`] = `Array []`;
 
+exports[`loader should not use .import.sass files (dart-sass) (sass): errors 1`] = `
+Array [
+  "ModuleBuildError: Module build failed (from ../src/cjs.js):
+SassError: Can't find stylesheet to import.",
+]
+`;
+
+exports[`loader should not use .import.sass files (dart-sass) (sass): warnings 1`] = `Array []`;
+
+exports[`loader should not use .import.scss files (dart-sass) (scss): errors 1`] = `
+Array [
+  "ModuleBuildError: Module build failed (from ../src/cjs.js):
+SassError: Can't find stylesheet to import.",
+]
+`;
+
+exports[`loader should not use .import.scss files (dart-sass) (scss): warnings 1`] = `Array []`;
+
 exports[`loader should output an understandable error (dart-sass) (sass): errors 1`] = `
 Array [
   "ModuleBuildError: Module build failed (from ../src/cjs.js):

test/loader.test.js

@@ -1486,6 +1486,18 @@ describe("loader", () => {
           expect(getWarnings(stats)).toMatchSnapshot("warnings");
           expect(getErrors(stats)).toMatchSnapshot("errors");
         });
+
+        it(`should not use .import.${syntax} files (${implementationName}) (${syntax})`, async () => {
+          const testId = getTestId("use-index-import", syntax);
+          const options = {
+            implementation: getImplementationByName(implementationName),
+          };
+          const compiler = getCompiler(testId, { loader: { options } });
+          const stats = await compile(compiler);
+
+          expect(getWarnings(stats)).toMatchSnapshot("warnings");
+          expect(getErrors(stats)).toMatchSnapshot("errors");
+        });
       }
     });
   });

test/sass/use-index-import.sass

@@ -0,0 +1 @@
+@use 'index-import'

test/scss/use-index-import.scss

@@ -0,0 +1 @@
+@use 'index-import';