Can't import the named export 'xxx' from non EcmaScript module (only default export is available)

Question

Can't import the named export 'xxx' from non EcmaScript module (only default export is available)

DeepakMohanSingh opened this issue 2 years ago · comments

Deepak Mohan Singh commented 2 years ago

Bug Report or Feature Request (mark with an `x`)

- [*] bug report 
- [ ] feature request
- [ ] question

OS and Version?

Windows 10

Versions

Angular CLI: 11.2.14
Node: 14.17.3

Repro steps

Install ngx-hightlightjs using: npm i ngx-highlightjs
Add the following to app.module.ts:

import { HighlightModule, HIGHLIGHT_OPTIONS } from 'ngx-highlightjs';

@NgModule({
imports: [
HighlightModule
],
providers: [
{
provide: HIGHLIGHT_OPTIONS,
useValue: {
fullLibraryLoader: () => import('highlight.js')
}
}
],
})

The log given by the failure

Error: node_modules/ngx-highlightjs/lib/highlight.d.ts:29:21 - error TS2694: Namespace '"C:/SL360/Kovai.Serverless360/Kovai.Serverless360.SPA/node_modules/@angular/core/core"' has no exported member 'ɵɵFactoryDeclaration'.

29     static ɵfac: i0.ɵɵFactoryDeclaration<Highlight, [null, null, null, { optional: true; }]>;
                       ~~~~~~~~~~~~~~~~~~~~


Error: node_modules/ngx-highlightjs/lib/highlight.d.ts:30:21 - error TS2694: Namespace '"C:/SL360/Kovai.Serverless360/Kovai.Serverless360.SPA/node_modules/@angular/core/core"' has no exported member 'ɵɵDirectiveDeclaration'.

30     static ɵdir: i0.ɵɵDirectiveDeclaration<Highlight, "[highlight]", never, { "code": "highlight"; "languages": "languages"; "lineNumbers": "lineNumbers"; }, { "highlighted": "highlighted"; }, never>;
                       ~~~~~~~~~~~~~~~~~~~~~~


Error: node_modules/ngx-highlightjs/lib/highlight.loader.d.ts:39:21 - error TS2694: Namespace '"C:/SL360/Kovai.Serverless360/Kovai.Serverless360.SPA/node_modules/@angular/core/core"' has no exported member 'ɵɵFactoryDeclaration'.

39     static ɵfac: i0.ɵɵFactoryDeclaration<HighlightLoader, [null, null, { optional: true; }]>;
                       ~~~~~~~~~~~~~~~~~~~~


Error: node_modules/ngx-highlightjs/lib/highlight.loader.d.ts:40:22 - error TS2694: Namespace '"C:/SL360/Kovai.Serverless360/Kovai.Serverless360.SPA/node_modules/@angular/core/core"' has no exported member 'ɵɵInjectableDeclaration'.

40     static ɵprov: i0.ɵɵInjectableDeclaration<HighlightLoader>;
                        ~~~~~~~~~~~~~~~~~~~~~~~


Error: node_modules/ngx-highlightjs/lib/highlight.module.d.ts:4:21 - error TS2694: Namespace '"C:/SL360/Kovai.Serverless360/Kovai.Serverless360.SPA/node_modules/@angular/core/core"' has no exported member 'ɵɵFactoryDeclaration'.

4     static ɵfac: i0.ɵɵFactoryDeclaration<HighlightModule, never>;
                      ~~~~~~~~~~~~~~~~~~~~


Error: node_modules/ngx-highlightjs/lib/highlight.module.d.ts:5:21 - error TS2694: Namespace '"C:/SL360/Kovai.Serverless360/Kovai.Serverless360.SPA/node_modules/@angular/core/core"' has no exported member 'ɵɵNgModuleDeclaration'.

5     static ɵmod: i0.ɵɵNgModuleDeclaration<HighlightModule, [typeof i1.Highlight], never, [typeof i1.Highlight]>;
                      ~~~~~~~~~~~~~~~~~~~~~


Error: node_modules/ngx-highlightjs/lib/highlight.module.d.ts:6:21 - error TS2694: Namespace '"C:/SL360/Kovai.Serverless360/Kovai.Serverless360.SPA/node_modules/@angular/core/core"' has no exported member 'ɵɵInjectorDeclaration'.

6     static ɵinj: i0.ɵɵInjectorDeclaration<HighlightModule>;
                      ~~~~~~~~~~~~~~~~~~~~~


Error: node_modules/ngx-highlightjs/lib/highlight.service.d.ts:88:21 - error TS2694: Namespace '"C:/SL360/Kovai.Serverless360/Kovai.Serverless360.SPA/node_modules/@angular/core/core"' has no exported member 'ɵɵFactoryDeclaration'.

88     static ɵfac: i0.ɵɵFactoryDeclaration<HighlightJS, [null, { optional: true; }]>;
                       ~~~~~~~~~~~~~~~~~~~~


Error: node_modules/ngx-highlightjs/lib/highlight.service.d.ts:89:22 - error TS2694: Namespace '"C:/SL360/Kovai.Serverless360/Kovai.Serverless360.SPA/node_modules/@angular/core/core"' has no exported member 'ɵɵInjectableDeclaration'.

89     static ɵprov: i0.ɵɵInjectableDeclaration<HighlightJS>;
                        ~~~~~~~~~~~~~~~~~~~~~~~


Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 14:22-37
Can't import the named export 'BehaviorSubject' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 143:11-19
Can't import the named export 'DOCUMENT' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 175:15-23
Can't import the named export 'DOCUMENT' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 534:10-19
Can't import the named export 'Directive' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 502:11-26
Can't import the named export 'DomSanitizer' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 548:12-27
Can't import the named export 'DomSanitizer' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 32:19-24
Can't import the named export 'EMPTY' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 36:17-22
Can't import the named export 'EMPTY' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 498:11-24
Can't import the named export 'ElementRef' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 544:12-25
Can't import the named export 'ElementRef' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 415:27-39
Can't import the named export 'EventEmitter' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 174:14-20
Can't import the named export 'Inject' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 180:14-20
Can't import the named export 'Inject' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 188:14-20
Can't import the named export 'Inject' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 402:14-20
Can't import the named export 'Inject' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 554:14-20
Can't import the named export 'Inject' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 165:10-20
Can't import the named export 'Injectable' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 389:10-20
Can't import the named export 'Injectable' from non EcmaScript module (only default export is available)

39mError: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 7:30-44
Can't import the named export 'InjectionToken' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 561:12-17
Can't import the named export 'Input' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 565:12-17
Can't import the named export 'Input' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 568:12-17
Can't import the named export 'Input' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 606:10-18
Can't import the named export 'NgModule' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 186:14-22
Can't import the named export 'Optional' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 400:14-22
Can't import the named export 'Optional' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 552:14-22
Can't import the named export 'Optional' from non EcmaScript module (only default export is available)
39m
Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 571:12-18
Can't import the named export 'Output' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 145:11-22
Can't import the named export 'PLATFORM_ID' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 181:15-26
Can't import the named export 'PLATFORM_ID' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 487:100-115
Can't import the named export 'SecurityContext' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 454:4-27
Can't import the named export 'animationFrameScheduler' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 483:4-27
Can't import the named export 'animationFrameScheduler' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 487:4-27
Can't import the named export 'animationFrameScheduler' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 34:12-22
Can't import the named export 'catchError' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 15:49-55
Can't import the named export 'filter' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 199:33-39
Can't import the named export 'filter' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 358:35-41
Can't import the named export 'filter' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 199:9-13
Can't import the named export 'from' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 17:8-25
Can't import the named export 'isPlatformBrowser' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 15:73-76
Can't import the named export 'map' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 87:34-37
Can't import the named export 'map' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 199:81-84
Can't import the named export 'map' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 237:35-38
Can't import the named export 'map' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 251:35-38
Can't import the named export 'map' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 262:35-38
Can't import the named export 'map' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 271:35-38
Can't import the named export 'map' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 281:35-38
Can't import the named export 'map' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 323:35-38
Can't import the named export 'map' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 333:35-38
Can't import the named export 'map' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 341:35-38
Can't import the named export 'map' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 349:35-38
Can't import the named export 'map' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 23:33-42
Can't import the named export 'switchMap' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 74:43-52
Can't import the named export 'switchMap' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 15:92-96
Can't import the named export 'take' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 28:47-50
Can't import the named export 'tap' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 86:126-129
Can't import the named export 'tap' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 292:35-38
Can't import the named export 'tap' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 301:35-38
Can't import the named export 'tap' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 313:35-38
Can't import the named export 'tap' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 358:76-79
Can't import the named export 'tap' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 54:15-25
Can't import the named export 'throwError' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 58:15-25
Can't import the named export 'throwError' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 62:15-25
Can't import the named export 'throwError' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 66:15-25
Can't import the named export 'throwError' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 78:11-21
Can't import the named export 'throwError' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 87:11-14
Can't import the named export 'zip' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 150:10-28
Can't import the named export 'ɵɵFactoryTarget' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 374:10-28
Can't import the named export 'ɵɵFactoryTarget' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 507:10-28
Can't import the named export 'ɵɵFactoryTarget' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 584:10-28
Can't import the named export 'ɵɵFactoryTarget' from non EcmaScript module (only default export is available)
Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 526:13-36
Can't import the named export 'ɵɵNgOnChangesFeature' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 515:6-20
Can't import the named export 'ɵɵclassProp' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 509:17-37
Can't import the named export 'ɵɵdefineDirective' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 159:0-27
Can't import the named export 'ɵɵngDeclareClassMetadata' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 383:0-27
Can't import the named export 'ɵɵngDeclareClassMetadata' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 528:0-27
Can't import the named export 'ɵɵngDeclareClassMetadata' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 600:0-27
Can't import the named export 'ɵɵngDeclareClassMetadata' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 137:23-44
Can't import the named export 'ɵɵngDeclareFactory' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 363:19-40
Can't import the named export 'ɵɵngDeclareFactory' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 492:17-38
Can't import the named export 'ɵɵngDeclareFactory' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 578:23-44
Can't import the named export 'ɵɵngDeclareFactory' from non EcmaScript module (only default export is available)39m

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 152:24-48
Can't import the named export 'ɵɵngDeclareInjectable' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 376:20-44
Can't import the named export 'ɵɵngDeclareInjectable' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 594:23-45
Can't import the named export 'ɵɵngDeclareInjector' from non EcmaScript module (only default export is available)

Error: ./node_modules/ngx-highlightjs/fesm2015/ngx-highlightjs.mjs 586:23-45
Can't import the named export 'ɵɵngDeclareNgModule' from non EcmaScript module (only default export is available)

Desired functionality

I did a simple install and added the required options in providers and imports array in app.module.ts and the server shows errors. Would appreciate any support to resolve this.

Mention any other details that might be useful

Nil

Murhaf Sousli · Answer 1 · Sat Jan 08 2022 01:15:24 GMT+0800 (China Standard Time)

This shouldn't be a problem with Angular 12 or 13

quan1997ap · Answer 2 · Tue Apr 26 2022 14:51:25 GMT+0800 (China Standard Time)

How to fix this issue. I'm working with Angular 10.
Thanks

Murhaf Sousli · Answer 3 · Sun May 15 2022 18:53:10 GMT+0800 (China Standard Time)

@quan1997ap Use an older version, check the changelog before Angular 11 upgrade which is v4.1.2 https://github.com/MurhafSousli/ngx-highlightjs/blob/master/CHANGELOG.md#412

quan1997ap · Answer 4 · Mon May 16 2022 18:23:45 GMT+0800 (China Standard Time)

Thank you. Vào 17:53, CN, 15 thg 5, 2022 Murhaf Sousli ***@***.***> đã viết:

…

@quan1997ap <https://github.com/quan1997ap> Use an older version, check the changelog before Angular 11 upgrade which is v4.1.2 https://github.com/MurhafSousli/ngx-highlightjs/blob/master/CHANGELOG.md#412 — Reply to this email directly, view it on GitHub <#206 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AJHEIMWM5DM3PQQ2S7W5AJ3VKDJSHANCNFSM5K6EJ33A> . You are receiving this because you were mentioned.Message ID: ***@***.***>

Can't import the named export 'xxx' from non EcmaScript module (only default export is available)

Bug Report or Feature Request (mark with an x)

OS and Version?

Versions

Repro steps

The log given by the failure

Desired functionality

Mention any other details that might be useful

Bug Report or Feature Request (mark with an `x`)