🔥 Горячая замена модуля

Горячая замена модуля (HMR) улучшает опыт разработки, автоматически обновляя модули в браузере во время выполнения без необходимости обновления всей страницы. Это означает, что состояние приложения может сохраняться при небольших изменениях. Реализация HMR в Parcel поддерживает как JavaScript, так и CSS-ресурсы из коробки. HMR автоматически отключается в режиме продакшена.

Когда вы сохраняете файлы, Parcel восстанавливает измененное и отправляет обновление всем работающим клиентам, содержащим новый код. Затем новый код заменяет старую версию и повторно оценивается вместе со всеми родителями. Вы можете подключиться к этому процессу, используя API module.hot, который может уведомить ваш код, когда модуль будет удалён, или когда приходит новая версия. Такие проекты, как react-hot-loader, могут помочь в этом процессе и работают с Parcel из коробки.

Есть два метода, которые нужно знать: module.hot.accept и module.hot.dispose. Вы вызываете module.hot.accept с функцией обратного вызова, которая выполняется при обновлении этого модуля или любых его зависимостей. module.hot.dispose принимает обратный вызов, который вызывается, когда этот модуль будет заменен.

if (module.hot) {
  module.hot.dispose(function () {
    // модуль будет заменен.
  });

  module.hot.accept(function () {
    // модуль или одна из его зависимостей была только что обновлена.
  });
}

Безопасная запись

У некоторых текстовых редакторов и IDE есть возможность, называемая safe write (безопасная запись), которая в основном предотвращает потерю данных, делая копию файла и переименовывая его при сохранении.

При использовании горячей перезагрузки эта возможность блокирует автоматическое обнаружение обновлений файлов, поэтому для отключения безопасной записи используйте подходящий вам вариант: