Пытаюсь понять, как импортировать пакет веб-сборки через webpack - PullRequest
Новая
       27

Пытаюсь понять, как импортировать пакет веб-сборки через webpack

1 голос
/ 09 июля 2020

Я нахожусь на webpack@4.43.0 и пытаюсь использовать эту библиотеку веб-сборки https://github.com/vislyhq/stretch В соответствии с документами я импортирую некоторые классы из нее, т.е. 

import { Allocator, Node } from 'stretch-layout';

class Base {
  public layoutNode;

  public constructor() {
    this.layoutNode = new Node(allocator, {});
  }
}

Однако, когда Я пытаюсь создать его с помощью веб-пакета (без каких-либо загрузчиков, и у меня есть .wasm в моей resolve.extensions конфигурации веб-пакета). Я получаю следующую ошибку:

Модуль WebAssembly включен в начальный фрагмент. Это недопустимо, потому что загрузка и компиляция WebAssembly должны выполняться асинхронно. Добавьте асинхронную c точку разделения (т.е. import ()) где-нибудь между вашей точкой входа и модулем WebAssembly:

Насколько я понимаю, мне нужно использовать import() для этого модуля, но как мне сделать этот импорт доступен моему классу? Приложение выйдет из строя, поскольку нам нужно дождаться этого импорта? Если я сделаю что-то подобное, я получаю сообщение об ошибке, что Allocator и Node не являются конструкторами. 

let Allocator: any = null;
let Node: any = null;

import('stretch-layout').then(module => {
  Allocator = module.Allocator;
  Node = module.Node;
});

1 Ответ

1 голос
/ 09 июля 2020

Мне удалось решить эту проблему с помощью последней бета-версии webpack 5, добавив следующие экспериментальные флаги в конфигурацию 

  experiments: {
    asyncWebAssembly: true,
    importAsync: true
  }

, таким образом, вам не нужно беспокоиться об асинхронности c import() выписки на всех

...