Как выполнить горячую перезагрузку модуля в собственном контексте импорта? - PullRequest
Новая
       37

Как выполнить горячую перезагрузку модуля в собственном контексте импорта?

11 голосов
/ 11 мая 2019

У меня есть следующая функция файл @/lang/index.js: 

async function fetchMessages(locale) {
  const module = await import(/*
    webpackChunkName: "lang/[request]",
    webpackExclude: /index/
  */ `@/lang/${locale}`)

  return module.default
}

Я бы хотел перезагрузить модули, импортированные этой функцией.Я пробовал несколько разных вариантов module.hot.accept(), но безуспешно.

Вот мой код горячей перезагрузки в конце того же файла, который не работает: 

if (process.env.NODE_ENV !== "production" && module.hot) {
  module.hot.accept(["./en-US"], () => {
    const { locale } = i18n
    fetchMessages(locale).then((strings) => {
      i18n.setLocaleMessage(locale, strings)
    })
  })
}

Любоймысли?Я хочу перезагрузить языковые файлы в горячем режиме при обнаружении изменений.

Спасибо!

1 Ответ

0 голосов
/ 21 мая 2019

У Webpack в настоящее время есть открытая проблема для этой "ошибки".Я нашел Webpack # 8637 после некоторого поиска.

Некоторые обходные пути с этой страницы включают:

  • Создайте отдельный файл, который содержит контекст импорта, примите этот отдельныйфайл.
  • Использование module.hot.accept(module.children[0].id, ...)

Решение, которое я использую в настоящее время, заключается в том, что я нашел сгенерированный идентификатор для контекста и сохранил его в переменной, передаваемой в module.hot.accept() вот так: 

const asyncChunkId = "./src/lang lazy recursive ^\\.\\/.*$ exclude: index"
module.hot.accept(asyncChunkId, () => { /* ... */ })

Это довольно хрупко, но пока делает свою работу.

...