Bug报告
当目标版本高于es5时,Typescript将附加的代码转译成在浏览器中无法执行的内容。
ng_reflect.ts:24
ERROR TypeError: X is not a constructor
at e.t (oidc-client.min.js:1:12082)
at new e (oidc-client.min.js:49:27046)
at new e (oidc-client.min.js:49:9187)
at new AppComponent (app.component.ts? [sm]:51:25)
at NodeInjectorFactory.AppComponent_Factory [as factory] (app.component.ts? [sm]:52:2)
at getNodeInjectable (di.ts:642:17)
at createRootComponent (component_ref.ts:426:4)
at ComponentFactory.create (component_ref.ts:262:10)
at ApplicationRef.bootstrap (application_ref.ts:1126:4)
at eval (application_ref.ts:623:1)
🔎 搜索词
Transpile, error, es5, es2015
🕗 版本与回归信息
今天我开始看到这个问题,当我从angular 13更新到14时,tsconfig中的类型script转译目标从es5更改为es2020,但问题似乎存在于es6及以后的版本。
⏯ Playground链接
将目标从"ES2015"更改为"ES5",在tsconfig中进行转译,使浏览器能够正确执行。
8条答案
按热度按时间yrwegjxp1#
这似乎是Angular或OIDC的问题,而不是TypeScript的问题。
bpsygsoo2#
@MartinJohns 你可能是对的,但对我来说,这似乎是Typescript的一个问题,因为从工作到非工作的唯一更改是从es5更改为目标(例如es2015)。这是否暗示它被转译得不同且不正确?
为什么在目标为es5时,它与angular或oidc客户端的问题无关?
mtb9vblg3#
请查看生成的TypeScript文件源代码,看起来是正确的。但最终你并没有使用TypeScript来编译你的代码,而是使用了Angular。Angular劫持了TypeScript编译器API,并在其周围做了很多无关紧要的事情,包括捆绑,你的错误出现在"oidc-client.min.js"文件中(TypeScript编译器并未生成该文件)。因此,我怀疑在创建捆绑包时出了问题。
7bsow1i64#
要查看这个,我们需要一个不涉及Angular的复现,以及一个实际的“这一行特别错误,应该改为其他东西”声明。人们在8年以上的时间里一直在使用> ES5类转换,没有问题,所以证明的责任完全在于认为它从未起作用的立场。
fae0ux8s5#
好的,我明白了,我会尝试在没有Angular 的情况下进行复制。/ Joel Fjordén...
From: Martin Johns ***@***.***> Sent: Wednesday, December 7, 2022 6:15:07 PM To: microsoft/TypeScript ***@***.***> Cc: Joel Fjordén ***@***.***>; Author ***@***.***> Subject: Re: [microsoft/TypeScript] Code transpilation does not work with any target later than es5. (Issue #51801) A brief look at the generated source for your TypeScript files it looked correctly. But in the end you're not using TypeScript to compile your code, you're using Angular for it. Angular hijacks the TypeScript compiler API and does a whole lot of mumbo jumbo around it, including bundling, and your error appears in the "oidc-client.min.js" file (which the TypeScript compiler does not generate). So I suspect something goes wrong when creating the bundle. — Reply to this email directly, view it on GitHub<#51801 (comment)>, or unsubscribe< https://github.com/notifications/unsubscribe-auth/AAZEZZKOGRHUZNA6AZT5XEDWMDAZXANCNFSM6AAAAAASWY5KBY >. You are receiving this because you authored the thread.Message ID: ***@***.***>
jaxagkaj6#
@MartinJohns 和 @RyanCavanaugh 这里有一个干净的TypeScript示例,说明了同样的问题,它在针对ES5时可以正常工作,但不适用于任何高于ES5的内容。
https://stackblitz.com/edit/typescript-acmvrk
转译问题似乎出在UserManagerSettings的ResponseValidatorCtor属性设置上。也许你可以找到一种方法,让代码可以在ES5以上的目标上进行转译?
z4iuyo4d7#
你的库提供的类型是错误的。这段代码可以正常工作:
ResponseValidatorCtor: ResponseValidatorCtor
当目标是ES5或更早版本时,你的类将被转换为函数,因为ES5及更早版本不支持类。当目标更新时,你的类将在JavaScript输出中保持为类。无论原因如何,你的oidc库无法处理类和错误。
TypeScript在这里表现正确。
50pmv0ei8#
请告诉我生成的输出中的哪一行代码是错误的,以及原因。