question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Enum output differences between es5 and es2015 (Declaration Merging Support)

See original GitHub issue

So, I’ll prefix this with the fact that this is my first foray into typescript compiler code, so if I’m just missing obvious things, I apologize in advance. 👍

I posted a bug in the ng-packagr library back in March related to an issue during compiling with declaration merging. Since it hasn’t received any solutions, I figured I’d try my hand at tracking down the cause of the error. The tl;dr of that issue is that enum declaration merging with namespaces throws a Identifier {name} has already been declared error. This is the initial code based on the typescript declaration merging documentation

enum AdapterType {
    MapValue = '[Adapter Type] map value',
    MapClass = '[Adapter Type] map class'
}
namespace AdapterType {
    /**
     * Contains an ordered array of the valid AdapterType members
     */
    export const members: AdapterType[] = [AdapterType.MapClass, AdapterType.MapValue];
}

export { AdapterType };

And this is the output when compiling to es2015.

// es2015, es6, etc.
/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/** @enum {string} */
const AdapterType = {
    MapValue: '[Adapter Type] map value',
    MapClass: '[Adapter Type] map class',
};
var AdapterType;
(function (AdapterType) {
    AdapterType.members = [AdapterType.MapClass, AdapterType.MapValue];
})(AdapterType || (AdapterType = {}));
export { AdapterType };

You’ll notice that the enum is declared initially with the const keyword, which means that the code that follows is invalid since you can’t redeclare a const. The es5 version of this code that gets output uses the var keyword initially, which allows the build to continue successfully.

// es5
/**
 * @fileoverview added by tsickle
 * @suppress {checkTypes,extraRequire,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
 */
/** @enum {string} */
var AdapterType = {
    MapValue: '[Adapter Type] map value',
    MapClass: '[Adapter Type] map class',
};
var AdapterType;
(function (AdapterType) {
    AdapterType.members = [AdapterType.MapClass, AdapterType.MapValue];
})(AdapterType || (AdapterType = {}));
export { AdapterType };

As far as I know, the output of enums as const is correct starting in es2015 since that’s when those keywords were introduced, however, by doing this, it prevents compilation when using declaration merging. When running this enum file through tsc and ngc, in both cases the generated output used the var keyword regardless of target.

So, my question is, does tsickle generate enums as a const for the closure compiler for a specific reason? (again, forgive my ignorance in the compiler world if this is an obvious thing). If not, I’d love to open a discussion of what could be done to better support typescript declaration merging.

Issue Analytics

  • State:open
  • Created 5 years ago
  • Comments:9 (2 by maintainers)

github_iconTop GitHub Comments

1reaction
BzenkoSergeycommented, Oct 26, 2019

any updates?

1reaction
ghenadiibatalskicommented, Aug 2, 2019

Any movement on this issue?

Read more comments on GitHub >

github_iconTop Results From Across the Web

ES5 to ESNext — here's every feature added to JavaScript ...
I wrote this article to help you move from pre-ES6 knowledge of ... You can also declare multiple variables at once in the...
Read more >
How can I guarantee that my enums definition doesn't change ...
In JavaScript, as it is a dynamic language, it is even possible to add enum values to the set later: // Add EXTRALARGE...
Read more >
TSConfig Reference - Docs on every TSConfig option
ECMAScript strict mode was introduced in ES5 and provides behavior tweaks to ... the difference between ES2015 (aka ES6 ) and ES2020 ,...
Read more >
Compiling and bundling TypeScript libraries with Webpack
We are aiming at creating three different outputs: The tsc compiled source + *.d.ts types ... We than wrap this into a npm...
Read more >
Overview - TypeScript
TypeScript 3.6 supports transforming import.meta to context.meta when your module ... The target option (allowing users to switch out of es5 to es3...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found