Сводные и глобальные переменные - PullRequest
0 голосов
/ 27 июня 2019

Я работаю над PWA.Чтобы улучшить производительность загрузки (а именно, оценка Lighthouse), мне нужно сначала представить облегченную страницу «загрузка, подождите», подождать, пока работник службы кэширует код приложения и пакет данных, а затем динамически загрузить пакет с помощью тега script,Однако существует один модуль ES, который является общим для обеих фаз приложения.

Упрощенная версия общего модуля (EventBus.js):

class EventBus {
  constructor() {}
  publish() {}
  subscribe() {}
}
let bus = new EventBus();
export { bus };

Внутри модулей комплектаЕсть множество ссылок на bus, например:

import { bus } from '../EventBus.js';
...
bus.publish(...);

Итак, мне нужно загрузить EventBus.js через тег script с начальной страницей «Пожалуйста, подождите», а затем иметь глобальный bus ссылка доступна в комплекте.

Я пробовал это для rollup.config.js:

import path from 'path';
const externalId = path.resolve(__dirname, './js/EventBus.js');
export default {
  input: './js/App.js',
  external: [externalId],
  output: {
    file: './bundle.js',
    format: 'iife',
    globals: {
      [externalId]: 'EventBus.bus'
    }
  }
};

Полученный пакет выглядит так:

(function (EventBus_js) {
...
EventBus_js.bus.publish(...)
...
}(EventBus.bus));

Это разрешило бы вызовы, подобные этому:

...
EventBus.bus.bus.publish(...);
...

Это определенно не то, что я ищу!

Пакет, который я ищу, будет выглядеть примерно так:

(function (bus) {
...
bus.publish(...)
...
}(bus));

Что я здесь не так делаю?

...