Горячая замена модуля не работает, когда компонент вызывается из функции - PullRequest
Новая
       84

Горячая замена модуля не работает, когда компонент вызывается из функции

0 голосов
/ 02 апреля 2020

Я хочу встроить компонент React в AMD, требующую js существующего приложения.

У меня есть 3 файла:

component.react. js

Является ли модуль ответственным за монтирование компонента реакции в DOM и файл записи веб-пакета. Выходной файл: component.js

import React from 'react';
import ReactDOM from 'react-dom';
import Configurator from './main';

module.hot && module.hot.accept();

const mount = () => {
    ReactDOM.render(<Configurator />, document.querySelector('#product-configurator'));
}

// CASE OK: This way, Configurator is rendered but HMR works as expected
// mount();

// CASE KO: This way, Configurator is rendered but HMR doesn't work
window && (window.configuratorMount = mount);

main. js

Является фиктивным компонентом React: 

import React from 'react';
export default () => <h1>Change me!</h1>;

configurator. js

Является ли модуль AMD ответственным за запуск компонента реакции. 

define([
    './component'
], function(reactComponent) {
    return function (config) {
        window.configuratorMount && window.configuratorMount(config);
    }
});

Я хочу вызвать модуль запуска, вызвав функцию window.configuratorMount, но пока поддержание работоспособности HMR.

В обоих случаях, когда я изменяю файл main.js, вывод консоли говорит: 

[WDS] App hot update...
[HMR] Checking for updates on the server...
[HMR] Updated modules:
[HMR]  - ./app/code/EcommPro/ProductPage/view/frontend/web.react/main.js
[HMR] App is up to date.

Но для CASE KO DOM не обновляется.

...