The top-level-await experiment is not enabled

1k Views Asked by At

I use pdfjs with Angular 14
When i tried to use one of the functions it gave me error that The top-level-await experiment is not enabled :

import { Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core';
import { ImageItem, TextItem } from '../../models/item';
import * as pdfjsLib from 'pdfjs-dist';

@Component({
  selector: 'app-pdf-editor-view',
  templateUrl: './pdf-editor-view.component.html',
  styleUrls: ['./pdf-editor-view.component.scss']
})
export class PdfEditorViewComponent {

  @Input() textItems: TextItem[] = [];
  @Input() imageItems: ImageItem[] = [];

  name = 'Angular';
  private pdfDoc: any;
  @ViewChild('canvas', { static: true }) canvas!: ElementRef<HTMLCanvasElement>;
  ctx!: CanvasRenderingContext2D;

  pdfurl = "../../../../../Luxoft - Angular Advanced.pdf";

  constructor() { }

  async showPdf() {
    const loadingTask = pdfjsLib.getDocument(this.pdfurl);
    this.pdfDoc = await loadingTask.promise;
  }

}

Error:

./node_modules/pdfjs-dist/build/pdf.mjs - Error: Module parse failed: The top-level-await experiment is not enabled (set experiments.topLevelAwait: true to enabled it)

File was processed with these loaders:

* ./node_modules/@angular-devkit/build-angular/src/babel/webpack-loader.js

* ./node_modules/source-map-loader/dist/cjs.js

You may need an additional loader to handle the result of these loaders.

Error: The top-level-await experiment is not enabled (set experiments.topLevelAwait: true to enabled it)

I tried to use custom webpack config and change angular.json to procced with it. But it didnt help

extra-webpack.config.js

const path = require('path');

module.exports = {
    experiments: {
      topLevelAwait: true,
    },

};
0

There are 0 best solutions below