remove Cannot import module 'xxx' error

Author: mizdra

.changeset/icy-turkeys-joke.md

@@ -0,0 +1,5 @@
+---
+'@css-modules-kit/core': minor
+---
+
+feat!: remove `Cannot import module 'xxx'` error

packages/codegen/src/project.test.ts

@@ -97,16 +97,6 @@ describe('addFile', () => {
     const project = createProject({ project: iff.rootDir });
     expect(formatDiagnostics(project.getDiagnostics(), iff.rootDir)).toMatchInlineSnapshot(`
       [
-        {
-          "category": "error",
-          "fileName": "<rootDir>/src/b.module.css",
-          "length": 14,
-          "start": {
-            "column": 10,
-            "line": 1,
-          },
-          "text": "Cannot import module './a.module.css'",
-        },
         {
           "category": "error",
           "fileName": "<rootDir>/src/c.module.css",
@@ -206,20 +196,7 @@ describe('updateFile', () => {
     // New semantic diagnostics are reported
     await writeFile(iff.join('src/a.module.css'), `@import './non-existent.module.css';`);
     project.updateFile(iff.join('src/a.module.css'));
-    expect(formatDiagnostics(project.getDiagnostics(), iff.rootDir)).toMatchInlineSnapshot(`
-      [
-        {
-          "category": "error",
-          "fileName": "<rootDir>/src/a.module.css",
-          "length": 25,
-          "start": {
-            "column": 10,
-            "line": 1,
-          },
-          "text": "Cannot import module './non-existent.module.css'",
-        },
-      ]
-    `);
+    expect(formatDiagnostics(project.getDiagnostics(), iff.rootDir)).toMatchInlineSnapshot(`[]`);
   });
   test('changes diagnostics in files that import it directly or indirectly', async () => {
     // This test case suggests the following facts:
@@ -320,16 +297,6 @@ describe('removeFile', () => {
     project.removeFile(iff.join('src/a.module.css'));
     expect(formatDiagnostics(project.getDiagnostics(), iff.rootDir)).toMatchInlineSnapshot(`
       [
-        {
-          "category": "error",
-          "fileName": "<rootDir>/src/b.module.css",
-          "length": 14,
-          "start": {
-            "column": 10,
-            "line": 1,
-          },
-          "text": "Cannot import module './a.module.css'",
-        },
         {
           "category": "error",
           "fileName": "<rootDir>/src/c.module.css",
@@ -471,30 +438,7 @@ describe('getDiagnostics', () => {
     });
     const project = createProject({ project: iff.rootDir });
     const diagnostics = project.getDiagnostics();
-    expect(formatDiagnostics(diagnostics, iff.rootDir)).toMatchInlineSnapshot(`
-      [
-        {
-          "category": "error",
-          "fileName": "<rootDir>/src/a.module.css",
-          "length": 27,
-          "start": {
-            "column": 10,
-            "line": 1,
-          },
-          "text": "Cannot import module './non-existent-1.module.css'",
-        },
-        {
-          "category": "error",
-          "fileName": "<rootDir>/src/b.module.css",
-          "length": 27,
-          "start": {
-            "column": 10,
-            "line": 1,
-          },
-          "text": "Cannot import module './non-existent-2.module.css'",
-        },
-      ]
-    `);
+    expect(formatDiagnostics(diagnostics, iff.rootDir)).toMatchInlineSnapshot(`[]`);
   });
   test('skips semantic diagnostics when project or syntactic diagnostics exist', async () => {
     const iff = await createIFF({

packages/core/src/checker.test.ts

@@ -285,7 +285,7 @@ describe('checkCSSModule', () => {
       ]
     `);
   });
-  test('report diagnostics for non-existing module', () => {
+  test('ignore non-existing module', () => {
     const args = prepareCheckerArgs([
       fakeCSSModule({
         fileName: '/a.module.css',
@@ -307,36 +307,7 @@ describe('checkCSSModule', () => {
       args.resolver,
       args.getCSSModule,
     );
-    expect(diagnostics).toMatchInlineSnapshot(`
-      [
-        {
-          "category": "error",
-          "file": {
-            "fileName": "/a.module.css",
-            "text": "",
-          },
-          "length": 0,
-          "start": {
-            "column": 1,
-            "line": 1,
-          },
-          "text": "Cannot import module './b.module.css'",
-        },
-        {
-          "category": "error",
-          "file": {
-            "fileName": "/a.module.css",
-            "text": "",
-          },
-          "length": 0,
-          "start": {
-            "column": 2,
-            "line": 1,
-          },
-          "text": "Cannot import module './c.module.css'",
-        },
-      ]
-    `);
+    expect(diagnostics).toMatchInlineSnapshot(`[]`);
   });
   test('report diagnostics for non-exported token', () => {
     const args = prepareCheckerArgs([
@@ -384,22 +355,29 @@ describe('checkCSSModule', () => {
       ]
     `);
   });
-  test('ignore token importers for unresolvable modules', () => {
+  test('ignore non-existing module', () => {
     const args = prepareCheckerArgs([
       fakeCSSModule({
         fileName: '/a.module.css',
-        tokenImporters: [fakeAtImportTokenImporter({ from: './unresolvable.module.css' })],
+        tokenImporters: [
+          fakeAtImportTokenImporter({ from: './b.module.css', fromLoc: fakeLoc({ column: 1 }) }),
+          fakeAtValueTokenImporter({
+            from: './c.module.css',
+            fromLoc: fakeLoc({ column: 2 }),
+            values: [fakeAtValueTokenImporterValue({ name: 'c_1', loc: fakeLoc({ column: 3 }) })],
+          }),
+        ],
       }),
     ]);
     const diagnostics = checkCSSModule(
       args.cssModules[0],
       args.config,
       args.exportBuilder,
       args.matchesPattern,
-      () => undefined, // Simulate unresolvable module
+      args.resolver,
       args.getCSSModule,
     );
-    expect(diagnostics).toEqual([]);
+    expect(diagnostics).toMatchInlineSnapshot(`[]`);
   });
   test('ignore token importers that do not match the pattern', () => {
     const args = prepareCheckerArgs([

packages/core/src/checker.ts

@@ -8,7 +8,6 @@ import type {
   Location,
   MatchesPattern,
   Resolver,
-  TokenImporter,
 } from './type.js';
 import { isValidAsJSIdentifier } from './util.js';
 
@@ -40,10 +39,7 @@ export function checkCSSModule(
     const from = resolver(tokenImporter.from, { request: cssModule.fileName });
     if (!from || !matchesPattern(from)) continue;
     const imported = getCSSModule(from);
-    if (!imported) {
-      diagnostics.push(createCannotImportModuleDiagnostic(cssModule, tokenImporter));
-      continue;
-    }
+    if (!imported) continue;
 
     if (tokenImporter.type === 'value') {
       const exportRecord = exportBuilder.build(imported);
@@ -77,16 +73,6 @@ export function checkCSSModule(
   return diagnostics;
 }
 
-function createCannotImportModuleDiagnostic(cssModule: CSSModule, tokenImporter: TokenImporter): Diagnostic {
-  return {
-    text: `Cannot import module '${tokenImporter.from}'`,
-    category: 'error',
-    file: { fileName: cssModule.fileName, text: cssModule.text },
-    start: { line: tokenImporter.fromLoc.start.line, column: tokenImporter.fromLoc.start.column },
-    length: tokenImporter.fromLoc.end.offset - tokenImporter.fromLoc.start.offset,
-  };
-}
-
 function createModuleHasNoExportedTokenDiagnostic(
   cssModule: CSSModule,
   tokenImporter: AtValueTokenImporter,

packages/ts-plugin/e2e-test/feature/semantic-diagnostics.test.ts

@@ -79,20 +79,6 @@ test('Semantic Diagnostics', async () => {
         },
         "text": "Module './c.module.css' has no exported token 'c_3'.",
       },
-      {
-        "category": "error",
-        "code": 0,
-        "end": {
-          "line": 5,
-          "offset": 24,
-        },
-        "source": "css-modules-kit",
-        "start": {
-          "line": 5,
-          "offset": 10,
-        },
-        "text": "Cannot import module './d.module.css'",
-      },
     ]
   `);
 });