microsoft / microsoft/TypeScript

tsc does not use amd-module name when emitting dynamic imports

Open
#29,480 0 comments 21 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Awaiting More Feedback Domain: JS Emit Suggestion
Dominant language
Go
Stars
111k
Forks
14.3k
Avg merge
2d 4h
Merged PRs (30d)
132

Description

TypeScript Version: 3.3.0-dev.20190118

Search Terms: amd-module, optional, dynamic, directive

Code

Scripts/foo.ts

///<amd-module name="customNameFoo" />

export function hello() {
    console.log('hello world');
}

Scripts/bar.ts

///<amd-module name="customNameBar" />

async function myFunction(): Promise<void> {
	//Dynamically import foo
        var fooModule = await import('./foo');

	fooModule.hello();
}

tsconfig.json

{
	"compileOnSave": true,
	"compilerOptions": {
		"target": "es5",
		"outDir": "GeneratedScripts",
		"module": "amd",
		"lib": [
			"es2015.promise",
			"dom",
			"es5",
			"scripthost"
		]
	},
	"include": [
		"Scripts/**/*"
	],
	"exclude": [
		"GeneratedScripts"
	]
}

would expect that the call to require would use the amd-module name for foo ("customNameFoo") and not "./foo". (If we non-dynamically imported foo, then the generated 'define' would refer to foo by it's amd-module name)
GeneratedScripts/bar.js

//...

return __generator(this, function (_a) {
                switch (_a.label) {
                    case 0: return [4 /*yield*/, new Promise(function (resolve_1, reject_1) { require(['./foo'], resolve_1, reject_1); })];
                    case 1:
                        fooModule = _a.sent();
                        fooModule.hello();
                        return [2 /*return*/];
                }
            });

Expected behavior: The generated amd code for a dynamic import should use the name of the module specified in the amd-module directive

Actual behavior: The generated code for the dynamic import uses relative path to the module

Related Issues:
https://github.com/Microsoft/TypeScript/pull/1158
https://github.com/Microsoft/TypeScript/issues/28760

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Reproduce the issue with Scripts/foo.ts, Scripts/bar.ts, and tsconfig.json, then inspect the compiler entry point for AMD dynamic-import emission. Compare GeneratedScripts/bar.js with the expected output; done means the generated require call uses foo's customNameFoo AMD module name instead of './foo'.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
compilers
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
48/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.