Synthesize namespace records for proper esm interop

src/compiler/commandLineParser.ts

@@ -398,6 +398,13 @@ namespace ts {
             category: Diagnostics.Module_Resolution_Options,
             description: Diagnostics.Allow_default_imports_from_modules_with_no_default_export_This_does_not_affect_code_emit_just_typechecking
         },
+        {
+            name: "ESModuleInterop",
+            type: "boolean",
+            showInSimplifiedHelpView: true,
+            category: Diagnostics.Module_Resolution_Options,
+            description: Diagnostics.Enables_emit_interoperability_bewteen_commonjs_and_ES_Modules_via_creation_of_namespace_objects_for_all_imports_Implies_allowSyntheticDefaultImports
+        },
         {
             name: "preserveSymlinks",
             type: "boolean",
@@ -700,7 +707,8 @@ namespace ts {
     export const defaultInitCompilerOptions: CompilerOptions = {
         module: ModuleKind.CommonJS,
         target: ScriptTarget.ES5,
-        strict: true
+        strict: true,
+        ESModuleInterop: true
     };
 
     let optionNameMapCache: OptionNameMap;

src/compiler/core.ts

@@ -1966,7 +1966,9 @@ namespace ts {
         const moduleKind = getEmitModuleKind(compilerOptions);
         return compilerOptions.allowSyntheticDefaultImports !== undefined
             ? compilerOptions.allowSyntheticDefaultImports
-            : moduleKind === ModuleKind.System;
+            : compilerOptions.ESModuleInterop
+                ? moduleKind !== ModuleKind.None && moduleKind < ModuleKind.ES2015
+                : moduleKind === ModuleKind.System;
     }
 
     export type StrictOptionName = "noImplicitAny" | "noImplicitThis" | "strictNullChecks" | "strictFunctionTypes" | "strictPropertyInitialization" | "alwaysStrict";

src/compiler/diagnosticMessages.json

@@ -3519,6 +3519,14 @@
         "category": "Error",
         "code": 7036
     },
+    "Enables emit interoperability bewteen commonjs and ES Modules via creation of namespace objects for all imports. Implies `allowSyntheticDefaultImports`.": {
+        "category": "Message",
+        "code": 7037
+    },
+    "A namespace-style import cannot be called or constructed, and will cause a failure at runtime.": {
+        "category": "Error",
+        "code": 7038
+    },
 
     "You cannot rename this element.": {
         "category": "Error",
@@ -3886,5 +3894,9 @@
     "Install '{0}'": {
         "category": "Message",
         "code": 95014
+    },
+    "Replace import with '{0}'.": {
+        "category": "Message",
+        "code": 95015
     }
 }

src/compiler/program.ts

@@ -1586,6 +1586,7 @@ namespace ts {
                 // synthesize 'import "tslib"' declaration
                 const externalHelpersModuleReference = createLiteral(externalHelpersModuleNameText);
                 const importDecl = createImportDeclaration(/*decorators*/ undefined, /*modifiers*/ undefined, /*importClause*/ undefined);
+                importDecl.transformFlags |= TransformFlags.NeverApplyImportHelper;
                 externalHelpersModuleReference.parent = importDecl;
                 importDecl.parent = file;
                 imports = [externalHelpersModuleReference];

src/compiler/transformers/module/es2015.ts

@@ -25,14 +25,14 @@ namespace ts {
                 if (externalHelpersModuleName) {
                     const statements: Statement[] = [];
                     const statementOffset = addPrologue(statements, node.statements);
-                    append(statements,
-                        createImportDeclaration(
-                            /*decorators*/ undefined,
-                            /*modifiers*/ undefined,
-                            createImportClause(/*name*/ undefined, createNamespaceImport(externalHelpersModuleName)),
-                            createLiteral(externalHelpersModuleNameText)
-                        )
+                    const tslibImport = createImportDeclaration(
+                        /*decorators*/ undefined,
+                        /*modifiers*/ undefined,
+                        createImportClause(/*name*/ undefined, createNamespaceImport(externalHelpersModuleName)),
+                        createLiteral(externalHelpersModuleNameText)
                     );
+                    tslibImport.transformFlags |= TransformFlags.NeverApplyImportHelper;
+                    append(statements, tslibImport);
 
                     addRange(statements, visitNodes(node.statements, visitor, isStatement, statementOffset));
                     return updateSourceFileNode(

src/compiler/transformers/module/module.ts

@@ -148,7 +148,7 @@ namespace ts {
             // Create an updated SourceFile:
             //
             //     define(moduleName?, ["module1", "module2"], function ...
-            return updateSourceFileNode(node,
+            const updated = updateSourceFileNode(node,
                 setTextRange(
                     createNodeArray([
                         createStatement(
@@ -192,6 +192,9 @@ namespace ts {
                     /*location*/ node.statements
                 )
             );
+
+            addEmitHelpers(updated, context.readEmitHelpers());
+            return updated;
         }
 
         /**
@@ -296,7 +299,7 @@ namespace ts {
             //      }
             //  })(function ...)
 
-            return updateSourceFileNode(
+            const updated = updateSourceFileNode(
                 node,
                 setTextRange(
                     createNodeArray([
@@ -328,6 +331,9 @@ namespace ts {
                     /*location*/ node.statements
                 )
             );
+
+            addEmitHelpers(updated, context.readEmitHelpers());
+            return updated;
         }
 
         /**
@@ -385,6 +391,18 @@ namespace ts {
             return { aliasedModuleNames, unaliasedModuleNames, importAliasNames };
         }
 
+        function getAMDImportExpressionForImport(node: ImportDeclaration | ExportDeclaration | ImportEqualsDeclaration) {
+            if (isImportEqualsDeclaration(node) || isExportDeclaration(node) || !getExternalModuleNameLiteral(node, currentSourceFile, host, resolver, compilerOptions)) {
+                return undefined;
+            }
+            const name = getLocalNameForExternalImport(node, currentSourceFile);
+            const expr = getHelperExpressionForImport(node, name);
+            if (expr === name) {
+                return undefined;
+            }
+            return createStatement(createAssignment(name, expr));
+        }
+
         /**
          * Transforms a SourceFile into an AMD or UMD module body.
          *
@@ -402,6 +420,9 @@ namespace ts {
 
             // Visit each statement of the module body.
             append(statements, visitNode(currentModuleInfo.externalHelpersImportDeclaration, sourceElementVisitor, isStatement));
+            if (moduleKind === ModuleKind.AMD) {
+                addRange(statements, mapDefined(currentModuleInfo.externalImports, getAMDImportExpressionForImport));
+            }
             addRange(statements, visitNodes(node.statements, sourceElementVisitor, isStatement, statementOffset));
 
             // Append the 'export =' statement if provided.
@@ -617,7 +638,12 @@ namespace ts {
                 }
             }
 
-            return createNew(createIdentifier("Promise"), /*typeArguments*/ undefined, [func]);
+            const promise = createNew(createIdentifier("Promise"), /*typeArguments*/ undefined, [func]);
+            if (compilerOptions.ESModuleInterop) {
+                context.requestEmitHelper(importStarHelper);
+                return createCall(createPropertyAccess(promise, createIdentifier("then")), /*typeArguments*/ undefined, [getHelperName("__importStar")]);
+            }
+            return promise;
         }
 
         function createImportCallExpressionCommonJS(arg: Expression | undefined, containsLexicalThis: boolean): Expression {
@@ -627,7 +653,11 @@ namespace ts {
             // We have to wrap require in then callback so that require is done in asynchronously
             // if we simply do require in resolve callback in Promise constructor. We will execute the loading immediately
             const promiseResolveCall = createCall(createPropertyAccess(createIdentifier("Promise"), "resolve"), /*typeArguments*/ undefined, /*argumentsArray*/ []);
-            const requireCall = createCall(createIdentifier("require"), /*typeArguments*/ undefined, arg ? [arg] : []);
+            let requireCall = createCall(createIdentifier("require"), /*typeArguments*/ undefined, arg ? [arg] : []);
+            if (compilerOptions.ESModuleInterop) {
+                context.requestEmitHelper(importStarHelper);
+                requireCall = createCall(getHelperName("__importStar"), /*typeArguments*/ undefined, [requireCall]);
+            }
 
             let func: FunctionExpression | ArrowFunction;
             if (languageVersion >= ScriptTarget.ES2015) {
@@ -660,6 +690,22 @@ namespace ts {
             return createCall(createPropertyAccess(promiseResolveCall, "then"), /*typeArguments*/ undefined, [func]);
         }
 
+
+        function getHelperExpressionForImport(node: ImportDeclaration, innerExpr: Expression) {
+            if (!compilerOptions.ESModuleInterop || node.transformFlags & TransformFlags.NeverApplyImportHelper) {
+                return innerExpr;
+            }
+            if (getNamespaceDeclarationNode(node)) {
+                context.requestEmitHelper(importStarHelper);
+                return createCall(getHelperName("__importStar"), /*typeArguments*/ undefined, [innerExpr]);
+            }
+            if (isDefaultImport(node)) {
+                context.requestEmitHelper(importDefaultHelper);
+                return createCall(getHelperName("__importDefault"), /*typeArguments*/ undefined, [innerExpr]);
+            }
+            return innerExpr;
+        }
+
         /**
          * Visits an ImportDeclaration node.
          *
@@ -681,7 +727,7 @@ namespace ts {
                             createVariableDeclaration(
                                 getSynthesizedClone(namespaceDeclaration.name),
                                 /*type*/ undefined,
-                                createRequireCall(node)
+                                getHelperExpressionForImport(node, createRequireCall(node))
                             )
                         );
                     }
@@ -694,7 +740,7 @@ namespace ts {
                             createVariableDeclaration(
                                 getGeneratedNameForNode(node),
                                 /*type*/ undefined,
-                                createRequireCall(node)
+                                getHelperExpressionForImport(node, createRequireCall(node))
                             )
                         );
 
@@ -1671,4 +1717,28 @@ namespace ts {
         text: `
             var __syncRequire = typeof module === "object" && typeof module.exports === "object";`
     };
+
+    // emit helper for `import * as Name from "foo"`
+    const importStarHelper: EmitHelper = {
+        name: "typescript:commonjsimportstar",
+        scoped: false,
+        text: `
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
+    result["default"] = mod;
+    return result;
+}`
+    };
+
+    // emit helper for `import Name from "foo"`
+    const importDefaultHelper: EmitHelper = {
+        name: "typescript:commonjsimportdefault",
+        scoped: false,
+        text: `
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+}`
+    };
 }

src/compiler/transformers/utilities.ts

@@ -143,6 +143,7 @@ namespace ts {
             createLiteral(externalHelpersModuleNameText));
 
         if (externalHelpersImportDeclaration) {
+            externalHelpersImportDeclaration.transformFlags |= TransformFlags.NeverApplyImportHelper;
             externalImports.unshift(externalHelpersImportDeclaration);
         }
 

src/compiler/types.ts

@@ -3165,6 +3165,7 @@ namespace ts {
         bindingElement?: BindingElement;    // Binding element associated with property symbol
         exportsSomeValue?: boolean;         // True if module exports some value (not just types)
         enumKind?: EnumKind;                // Enum declaration classification
+        originatingImport?: ImportDeclaration | ImportCall; // Import declaration which produced the symbol, present if the symbol is poisoned
         lateSymbol?: Symbol;                // Late-bound symbol for a computed property
     }
 
@@ -3877,6 +3878,7 @@ namespace ts {
         typeRoots?: string[];
         /*@internal*/ version?: boolean;
         /*@internal*/ watch?: boolean;
+        ESModuleInterop?: boolean;
 
         [option: string]: CompilerOptionsValue | JsonSourceFile | undefined;
     }
@@ -4344,6 +4346,7 @@ namespace ts {
         ContainsYield = 1 << 24,
         ContainsHoistedDeclarationOrCompletion = 1 << 25,
         ContainsDynamicImport = 1 << 26,
+        NeverApplyImportHelper = 1 << 27, // Indicates the node should never be wrapped with an import star helper (because, for example, it import tslib itself)
 
         // Please leave this as 1 << 29.
         // It is the maximum bit we can set before we outgrow the size of a v8 small integer (SMI) on an x86 system.
@@ -4383,6 +4386,7 @@ namespace ts {
         // - Additional bitmasks
         TypeScriptClassSyntaxMask = ContainsParameterPropertyAssignments | ContainsPropertyInitializer | ContainsDecorators,
         ES2015FunctionSyntaxMask = ContainsCapturedLexicalThis | ContainsDefaultValueAssignments,
+        StickyFlags = NeverApplyImportHelper, // Flags which once set are retained by `aggregateTransformFlags` instead of overwritten
     }
 
     export interface SourceMapRange extends TextRange {

src/compiler/visitor.ts

@@ -1466,7 +1466,9 @@ namespace ts {
      * Aggregates the TransformFlags for a Node and its subtree.
      */
     export function aggregateTransformFlags<T extends Node>(node: T): T {
+        const stickyFlags = node.transformFlags & TransformFlags.StickyFlags;
         aggregateTransformFlagsForNode(node);
+        node.transformFlags |= stickyFlags;
         return node;
     }
 

src/services/codefixes/fixInvalidImportSyntax.ts

@@ -0,0 +1,52 @@
+/* @internal */
+namespace ts.codefix {
+    registerCodeFix({
+        errorCodes: [Diagnostics.A_namespace_style_import_cannot_be_called_or_constructed_and_will_cause_a_failure_at_runtime.code],
+        getCodeActions: getActionsForInvalidImport
+    });
+
+    function getActionsForInvalidImport(context: CodeFixContext): CodeAction[] | undefined {
+        const sourceFile = context.sourceFile;
+
+        // This is the whole import statement, eg:
+        // import * as Bluebird from 'bluebird';
+        // ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
+        const node = getTokenAtPosition(sourceFile, context.span.start, /*includeJsDocComment*/ false).parent as ImportDeclaration;
+        const namespace = getNamespaceDeclarationNode(node) as NamespaceImport;
+        const opts = context.program.getCompilerOptions();
+        const variations: CodeAction[] = [];
+        if (opts.module === ModuleKind.CommonJS || (!opts.module && opts.target < ScriptTarget.ES2015)) {
+            // import Bluebird = require("bluebird");
+            const replacement = createImportEqualsDeclaration(
+                /*decorators*/ undefined,
+                /*modifiers*/ undefined,
+                namespace.name,
+                createExternalModuleReference(node.moduleSpecifier)
+            );
+            const changeTracker = textChanges.ChangeTracker.fromContext(context);
+            changeTracker.replaceNode(sourceFile, node, replacement, { useNonAdjustedEndPosition: true });
+            const changes = changeTracker.getChanges();
+            variations.push({
+                description: formatStringFromArgs(getLocaleSpecificMessage(Diagnostics.Replace_import_with_0), [changes[0].textChanges[0].newText]),
+                changes
+            });
+        }
+
+        // import Bluebird from "bluebird";
+        const replacement = createImportDeclaration(
+            /*decorators*/ undefined,
+            /*modifiers*/ undefined,
+            createImportClause(namespace.name, /*namedBindings*/ undefined),
+            node.moduleSpecifier
+        );
+        const changeTracker = textChanges.ChangeTracker.fromContext(context);
+        changeTracker.replaceNode(sourceFile, node, replacement, { useNonAdjustedEndPosition: true });
+        const changes = changeTracker.getChanges();
+        variations.push({
+            description: formatStringFromArgs(getLocaleSpecificMessage(Diagnostics.Replace_import_with_0), [changes[0].textChanges[0].newText]),
+            changes
+        });
+
+        return variations;
+    }
+}

src/services/codefixes/fixes.ts

@@ -15,3 +15,5 @@
 /// <reference path='disableJsDiagnostics.ts' />
 /// <reference path='helpers.ts' />
 /// <reference path='inferFromUsage.ts' />
+/// <reference path="fixInvalidImportSyntax.ts" />
+

tests/baselines/reference/allowSyntheticDefaultImports1.js

@@ -4,21 +4,12 @@
 import Namespace from "./b";
 export var x = new Namespace.Foo();
 
-//// [b.ts]
+//// [b.d.ts]
 export class Foo {
 	member: string;
 }
 
 
-//// [b.js]
-"use strict";
-exports.__esModule = true;
-var Foo = /** @class */ (function () {
-    function Foo() {
-    }
-    return Foo;
-}());
-exports.Foo = Foo;
 //// [a.js]
 "use strict";
 exports.__esModule = true;