Improve errors on module: node12 and extensionless relative imports

src/compiler/checker.ts

@@ -1015,6 +1015,18 @@ namespace ts {
         const builtinGlobals = createSymbolTable();
         builtinGlobals.set(undefinedSymbol.escapedName, undefinedSymbol);
 
+        // Extensions suggested for path imports when module resolution is node12 or higher.
+        // The first element of each tuple is the extension a file has.
+        // The second element of each tuple is the extension that should be used in a path import.
+        // e.g. if we want to import file `foo.mts`, we should write `import {} from "./foo.mjs".
+        const suggestedExtensions: [string, string][] = [
+            [".mts", ".mjs"],
+            [".ts", ".js"],
+            [".cts", ".cjs"],
+            [".mjs", ".mjs"],
+            [".js", ".js"],
+            [".cjs", ".cjs"]];
+
         initializeTypeChecker();
 
         return checker;
@@ -3417,7 +3429,7 @@ namespace ts {
                     (isModuleDeclaration(location) ? location : location.parent && isModuleDeclaration(location.parent) && location.parent.name === location ? location.parent : undefined)?.name ||
                     (isLiteralImportTypeNode(location) ? location : undefined)?.argument.literal;
             const mode = contextSpecifier && isStringLiteralLike(contextSpecifier) ? getModeForUsageLocation(currentSourceFile, contextSpecifier) : currentSourceFile.impliedNodeFormat;
-            const resolvedModule = getResolvedModule(currentSourceFile, moduleReference, mode)!; // TODO: GH#18217
+            const resolvedModule = getResolvedModule(currentSourceFile, moduleReference, mode);
             const resolutionDiagnostic = resolvedModule && getResolutionDiagnostic(compilerOptions, resolvedModule);
             const sourceFile = resolvedModule && !resolutionDiagnostic && host.getSourceFile(resolvedModule.resolvedFileName);
             if (sourceFile) {
@@ -3460,10 +3472,10 @@ namespace ts {
             if (resolvedModule && !resolutionExtensionIsTSOrJson(resolvedModule.extension) && resolutionDiagnostic === undefined || resolutionDiagnostic === Diagnostics.Could_not_find_a_declaration_file_for_module_0_1_implicitly_has_an_any_type) {
                 if (isForAugmentation) {
                     const diag = Diagnostics.Invalid_module_name_in_augmentation_Module_0_resolves_to_an_untyped_module_at_1_which_cannot_be_augmented;
-                    error(errorNode, diag, moduleReference, resolvedModule.resolvedFileName);
+                    error(errorNode, diag, moduleReference, resolvedModule!.resolvedFileName); // TODO: GH#18217
                 }
                 else {
-                    errorOnImplicitAnyModule(/*isError*/ noImplicitAny && !!moduleNotFoundError, errorNode, resolvedModule, moduleReference);
+                    errorOnImplicitAnyModule(/*isError*/ noImplicitAny && !!moduleNotFoundError, errorNode, resolvedModule!, moduleReference); // TODO: GH#18217
                 }
                 // Failed imports and untyped modules are both treated in an untyped manner; only difference is whether we give a diagnostic first.
                 return undefined;
@@ -3484,6 +3496,9 @@ namespace ts {
                 }
                 else {
                     const tsExtension = tryExtractTSExtension(moduleReference);
+                    const isESMFile = currentSourceFile.impliedNodeFormat === ModuleKind.ESNext;
+                    const isExtensionlessRelativePathImport = pathIsRelative(moduleReference) && !hasExtension(moduleReference);
+                    const resolutionIsNode12OrHigher = getEmitModuleResolutionKind(compilerOptions) >= ModuleResolutionKind.Node12;
                     if (tsExtension) {
                         const diag = Diagnostics.An_import_path_cannot_end_with_a_0_extension_Consider_importing_1_instead;
                         const importSourceWithoutExtension = removeExtension(moduleReference, tsExtension);
@@ -3503,6 +3518,18 @@ namespace ts {
                         hasJsonModuleEmitEnabled(compilerOptions)) {
                         error(errorNode, Diagnostics.Cannot_find_module_0_Consider_using_resolveJsonModule_to_import_module_with_json_extension, moduleReference);
                     }
+                    else if (isESMFile && resolutionIsNode12OrHigher && isExtensionlessRelativePathImport) {
+                        const absoluteRef =  getNormalizedAbsolutePath(moduleReference, getDirectoryPath(currentSourceFile.path));
+                        const suggestedExt = suggestedExtensions.find(([actualExt, _importExt]) => host.fileExists(absoluteRef + actualExt))?.[1];
+                        if (suggestedExt) {
+                            error(errorNode,
+                                Diagnostics.Cannot_use_a_relative_import_path_without_an_extension_in_an_ES_module_when_moduleResolution_is_node12_or_higher_Did_you_mean_0,
+                                moduleReference + suggestedExt);
+                        }
+                        else {
+                            error(errorNode, Diagnostics.Cannot_use_a_relative_import_path_without_an_extension_in_an_ES_module_when_moduleResolution_is_node12_or_higher);
+                        }
+                    }
                     else {
                         error(errorNode, moduleNotFoundError, moduleReference);
                     }

src/compiler/diagnosticMessages.json

@@ -3341,6 +3341,14 @@
         "category": "Error",
         "code": 2833
     },
+    "Cannot use a relative import path without an extension in an ES module when '--moduleResolution' is 'node12' or higher.": {
+        "category": "Error",
+        "code": 2834
+    },
+    "Cannot use a relative import path without an extension in an ES module when '--moduleResolution' is 'node12' or higher. Did you mean '{0}'?": {
+        "category": "Error",
+        "code": 2835
+    },
 
     "Import declaration '{0}' is using private name '{1}'.": {
         "category": "Error",

src/compiler/types.ts

@@ -5983,7 +5983,7 @@ namespace ts {
     export enum ModuleResolutionKind {
         Classic  = 1,
         NodeJs   = 2,
-        // Starting with node12, node's module resolver has significant departures from tranditional cjs resolution
+        // Starting with node12, node's module resolver has significant departures from traditional cjs resolution
         // to better support ecmascript modules and their use within node - more features are still being added, so
         // we can expect it to change over time, and as such, offer both a `NodeNext` moving resolution target, and a `Node12`
         // version-anchored resolution target

tests/baselines/reference/moduleResolutionWithoutExtensions.errors.txt

@@ -0,0 +1,20 @@
+/src/bar.mts(1,21): error TS2835: Cannot use a relative import path without an extension in an ES module when '--moduleResolution' is 'node12' or higher. Did you mean './foo.mjs'?
+/src/bar.mts(2,21): error TS2834: Cannot use a relative import path without an extension in an ES module when '--moduleResolution' is 'node12' or higher.
+
+
+==== /src/foo.mts (0 errors) ====
+    export function foo() {
+        return "";
+    }
+
+    // Extensionless relative import in an ES module
+==== /src/bar.mts (2 errors) ====
+    import { foo } from "./foo";
+                        ~~~~~~~
+!!! error TS2835: Cannot use a relative import path without an extension in an ES module when '--moduleResolution' is 'node12' or higher. Did you mean './foo.mjs'?
+    import { baz } from "./baz";
+                        ~~~~~~~
+!!! error TS2834: Cannot use a relative import path without an extension in an ES module when '--moduleResolution' is 'node12' or higher.
+    foo;
+    baz;
+

tests/baselines/reference/moduleResolutionWithoutExtensions.js

@@ -0,0 +1,25 @@
+//// [tests/cases/conformance/externalModules/moduleResolutionWithoutExtensions.ts] ////
+
+//// [foo.mts]
+export function foo() {
+    return "";
+}
+
+// Extensionless relative import in an ES module
+//// [bar.mts]
+import { foo } from "./foo";
+import { baz } from "./baz";
+foo;
+baz;
+
+
+//// [foo.mjs]
+export function foo() {
+    return "";
+}
+// Extensionless relative import in an ES module
+//// [bar.mjs]
+import { foo } from "./foo";
+import { baz } from "./baz";
+foo;
+baz;

tests/baselines/reference/moduleResolutionWithoutExtensions.symbols

@@ -0,0 +1,21 @@
+=== /src/foo.mts ===
+export function foo() {
+>foo : Symbol(foo, Decl(foo.mts, 0, 0))
+
+    return "";
+}
+
+// Extensionless relative import in an ES module
+=== /src/bar.mts ===
+import { foo } from "./foo";
+>foo : Symbol(foo, Decl(bar.mts, 0, 8))
+
+import { baz } from "./baz";
+>baz : Symbol(baz, Decl(bar.mts, 1, 8))
+
+foo;
+>foo : Symbol(foo, Decl(bar.mts, 0, 8))
+
+baz;
+>baz : Symbol(baz, Decl(bar.mts, 1, 8))
+

tests/baselines/reference/moduleResolutionWithoutExtensions.types

@@ -0,0 +1,22 @@
+=== /src/foo.mts ===
+export function foo() {
+>foo : () => string
+
+    return "";
+>"" : ""
+}
+
+// Extensionless relative import in an ES module
+=== /src/bar.mts ===
+import { foo } from "./foo";
+>foo : any
+
+import { baz } from "./baz";
+>baz : any
+
+foo;
+>foo : any
+
+baz;
+>baz : any
+

tests/cases/conformance/externalModules/moduleResolutionWithoutExtensions.ts

@@ -0,0 +1,14 @@
+// @moduleResolution: node12
+// @module: node12
+
+// @filename: /src/foo.mts
+export function foo() {
+    return "";
+}
+
+// Extensionless relative import in an ES module
+// @Filename: /src/bar.mts
+import { foo } from "./foo";
+import { baz } from "./baz";
+foo;
+baz;