Как выставить зависимости webpack в `window`? - PullRequest
1 голос
/ 18 марта 2019

Этот вопрос возник из Kirby CMS У меня возникла проблема.Вот краткое резюме.

Панель Kirby использует Vue и Vuex и связывает их с Webpack (через Vue CLI).У этого есть два блока, продавцы и приложение.Люди могут также написать плагины для этой панели.Порядок выполнения JS выглядит следующим образом:

  1. vendors.js chunk
  2. Пакеты JavaScript плагинов (например, myplugin.js)
  3. app.js chunk

Вопрос в том, как myplugin.js может ссылаться на тот же Vuex, что и app.js?Как я описал в своей проблеме, есть проблемы с Vue, если я использую свои собственные Vue и Vuex в myplugin.js.Поскольку Кирби загружает мой компонент Vue в его собственный экземпляр Vue, хранилище этого компонента должно использовать хранилище Vuex, привязанное к тому же экземпляру Vue, в противном случае реактивность Vue нарушается.

Мы не можем добавить следующее в app.js:

import Vue from 'vue'
import Vuex from 'vuex'

window.KirbyVue = Vue
window.KirbyVuex = Vuex

, поскольку блок app.js выполняется после myplugin.js.Поэтому при разрешении импорта в myplugin.js ссылки на KirbyVuex еще не будут существовать.Так что вы не можете сделать:

new KirbyVuex.Store({
  ...
})

, потому что KirbyVuex будет undefined.

Так что, очевидно, эти зависимости должны быть представлены в чанке vendors.js.Есть ли способ, которым это могло бы случиться?Плагину может понадобиться использовать другие зависимости панели кроме Vue и Vuex.Было бы излишним включать их, если они уже есть.Кроме того, может потребоваться, чтобы плагин и панель использовали одно и то же состояние зависимости, и в этом случае использование одной и той же зависимости является требованием (как в моем случае с Vuex).

Есть ли способ дляпанель, чтобы выставить свои зависимости объекту window?Он уже создает window.panel, который содержит полезные данные для плагинов.Можно ли как-то добавить туда window.panel.vendors?Или, может быть, просто window.vendors?Оттуда вы сможете использовать new vendors.Vuex.Store(...) в плагине.

Есть ли в Webpack функциональность, позволяющая открывать зависимости для внешнего кода?

...