Improve error message

Author: Andy Hanson

src/compiler/checker.ts

@@ -1366,8 +1366,10 @@ namespace ts {
 
             if (moduleNotFoundError) {
                 // report errors only if it was requested
-                if (hasTypeScriptFileExtensionNonDts(moduleName)) {
-                    error(moduleReferenceLiteral, Diagnostics.Module_name_should_not_include_a_ts_extension_Colon_0, moduleName);
+                const nonDtsExtension = tryExtractTypeScriptExtensionNonDts(moduleName);
+                if (nonDtsExtension) {
+                    const diag = Diagnostics.An_import_path_should_not_end_with_a_0_extension_Consider_importing_1_instead;
+                    error(moduleReferenceLiteral, diag, nonDtsExtension, removeExtension(moduleName, nonDtsExtension));
                 }
                 else {
                     error(moduleReferenceLiteral, moduleNotFoundError, moduleName);

src/compiler/core.ts

@@ -93,6 +93,17 @@ namespace ts {
         return undefined;
     }
 
+    /** Works like Array.prototype.find. */
+    export function find<T>(array: T[], predicate: (element: T, index: number) => boolean): T | undefined {
+        for (let i = 0, len = array.length; i < len; i++) {
+            const value = array[i];
+            if (predicate(value, i)) {
+                return value;
+            }
+        }
+        return undefined;
+    }
+
     export function contains<T>(array: T[], value: T): boolean {
         if (array) {
             for (const v of array) {
@@ -941,7 +952,7 @@ namespace ts {
      *  [^./]                   # matches everything up to the first . character (excluding directory seperators)
      *  (\\.(?!min\\.js$))?     # matches . characters but not if they are part of the .min.js file extension
      */
-    const singleAsteriskRegexFragmentFiles = "([^./]|(\\.(?!min\\.js$))?)*";
+    const singleAsteriskRegexFragmentFiles = "([^./]|(\\.(?!min\\.js$))?)*";
     const singleAsteriskRegexFragmentOther = "[^/]*";
 
     export function getRegularExpressionForWildcard(specs: string[], basePath: string, usage: "files" | "directories" | "exclude") {
@@ -1271,8 +1282,12 @@ namespace ts {
         return path;
     }
 
-    export function tryRemoveExtension(path: string, extension: string): string {
-        return fileExtensionIs(path, extension) ? path.substring(0, path.length - extension.length) : undefined;
+    export function tryRemoveExtension(path: string, extension: string): string | undefined {
+        return fileExtensionIs(path, extension) ? removeExtension(path, extension) : undefined;
+    }
+
+    export function removeExtension(path: string, extension: string): string {
+        return path.substring(0, path.length - extension.length);
     }
 
     export function isJsxOrTsxExtension(ext: string): boolean {

src/compiler/diagnosticMessages.json

@@ -1951,7 +1951,7 @@
         "category": "Error",
         "code": 2690
     },
-    "Module name should not include a '.ts' extension: '{0}'.": {
+    "An import path should not end with a '{0}' extension. Consider importing '{1}' instead.": {
         "category": "Error",
         "code": 2691
     },

src/compiler/utilities.ts

@@ -2726,8 +2726,9 @@ namespace ts {
         return forEach(supportedTypeScriptExtensions, extension => fileExtensionIs(fileName, extension));
     }
 
-    export function hasTypeScriptFileExtensionNonDts(fileName: string) {
-        return forEach(supportedTypeScriptExtensionsNonDts, extension => fileExtensionIs(fileName, extension));
+    /** Return ".ts" or ".tsx" if that is the extension. */
+    export function tryExtractTypeScriptExtensionNonDts(fileName: string): string | undefined {
+        return find(supportedTypeScriptExtensionsNonDts, extension => fileExtensionIs(fileName, extension));
     }
 
     /**

tests/baselines/reference/moduleResolutionNoTs.errors.txt

@@ -1,14 +1,25 @@
-tests/cases/compiler/user.ts(4,15): error TS2690: Module name should not include a '.ts' extension: './m.ts'.
+tests/cases/compiler/user.ts(4,15): error TS2691: An import path should not end with a '.ts' extension. Consider importing './x' instead.
+tests/cases/compiler/user.ts(5,15): error TS2691: An import path should not end with a '.tsx' extension. Consider importing './y' instead.
 
 
-==== tests/cases/compiler/user.ts (1 errors) ====
+==== tests/cases/compiler/user.ts (2 errors) ====
     // '.ts' extension is OK in a reference
-    ///<reference path="./m.ts"/>
+    ///<reference path="./x.ts"/>
 
-    import x from "./m.ts";
+    import x from "./x.ts";
                   ~~~~~~~~
-!!! error TS2690: Module name should not include a '.ts' extension: './m.ts'.
+!!! error TS2691: An import path should not end with a '.ts' extension. Consider importing './x' instead.
+    import y from "./y.tsx";
+                  ~~~~~~~~~
+!!! error TS2691: An import path should not end with a '.tsx' extension. Consider importing './y' instead.
 
-==== tests/cases/compiler/m.ts (0 errors) ====
+    // Making sure the suggested fixes are valid:
+    import x2 from "./x";
+    import y2 from "./y";
+    
+==== tests/cases/compiler/x.ts (0 errors) ====
+    export default 0;
+    
+==== tests/cases/compiler/y.tsx (0 errors) ====
     export default 0;
 

tests/baselines/reference/moduleResolutionNoTs.js

@@ -1,20 +1,32 @@
 //// [tests/cases/compiler/moduleResolutionNoTs.ts] ////
 
-//// [m.ts]
+//// [x.ts]
+export default 0;
+
+//// [y.tsx]
 export default 0;
 
 //// [user.ts]
 // '.ts' extension is OK in a reference
-///<reference path="./m.ts"/>
+///<reference path="./x.ts"/>
+
+import x from "./x.ts";
+import y from "./y.tsx";
 
-import x from "./m.ts";
+// Making sure the suggested fixes are valid:
+import x2 from "./x";
+import y2 from "./y";
 
 
-//// [m.js]
+//// [x.js]
+"use strict";
+exports.__esModule = true;
+exports["default"] = 0;
+//// [y.js]
 "use strict";
 exports.__esModule = true;
 exports["default"] = 0;
 //// [user.js]
 // '.ts' extension is OK in a reference
-///<reference path="./m.ts"/>
+///<reference path="./x.ts"/>
 "use strict";

tests/cases/compiler/moduleResolutionNoTs.ts

@@ -1,8 +1,16 @@
-// @filename: m.ts
+// @filename: x.ts
+export default 0;
+
+// @filename: y.tsx
 export default 0;
 
 // @filename: user.ts
 // '.ts' extension is OK in a reference
-///<reference path="./m.ts"/>
+///<reference path="./x.ts"/>
+
+import x from "./x.ts";
+import y from "./y.tsx";
 
-import x from "./m.ts";
+// Making sure the suggested fixes are valid:
+import x2 from "./x";
+import y2 from "./y";