webpack-dev-server: как сохранить состояние с помощью module.hot.data? - PullRequest
0 голосов
/ 06 ноября 2019

Я использую горячую замену модуля (HMR) webpack-dev-server. В коде у меня есть это:

// index.js

// ...

window.enableFoo = false; // can set this to 'true' in DevTools console

if (module && module.hot) {
    module.hot.accept((err) => {
        console.error('HMR accept() error: ' + err);
    });
    module.hot.addStatusHandler(status => {
        if (status === 'apply') {
            console.log('HMR: update applied');
        }
    });
}

Я хотел бы сохранить window.enableFoo при обновлении HMR. Однако каждый раз, когда применяется обновление, window.enableFoo возвращается к исходному значению, установленному в коде, которое здесь true.

Я прочитал из API-интерфейса HMR , который яМне нужно использовать module.hot.dispose() и module.hot.data, но я не смог найти пример того, как это сделать, и документ не уточнил. Может ли кто-нибудь мне помочь?

( этот пост похож, но код запутан в Angular и его нелегко понять ... также эта тема говорит "Если вы хотите сохранить состояние, используйте dispose и module.hot.data, не используйте accept "?)

1 Ответ

0 голосов
/ 07 ноября 2019

После копания этот код работает. Полагаю, мне лучше вставить это здесь, если кто-то тоже ищет ответ.

// index.js

// ...

window.enableFoo = false; // can set this to 'true' in DevTools console

if (module && module.hot) {
    module.hot.accept((err) => {
        console.error('HMR accept() error: ' + err);
    });
    module.hot.addStatusHandler(status => {
        if (status === 'apply') {
            console.log('HMR: update applied');
        }
    });

    // added begin ----------------------------------
    module.hot.addDisposeHandler(data => {
        data.enableFoo = window.enableFoo;
    });
    if (module.hot.data) {
        window.enableFoo = module.hot.data.enableFoo;
        console.log('window.enableFoo ' + window.enableFoo);
    }
    // added end ----------------------------------
}
...