Проблема с плагином react-refresh-webpack-plugin и wordpress/scripts с использованием --hot

Я не могу получить HMR с запущенным «wp-scripts start --hot». Я пробовал это в нескольких проектах, включая довольно пустые проекты.

Как только я добавляю флаг --hot в свой скрипт npm, я все еще могу запустить скрипт, но я получаю это сообщение об ошибке в своей консоли:

      ReactRefreshEntry.js:17 Uncaught TypeError: Cannot read properties of undefined (reading 'injectIntoGlobalHook')
at ./node_modules/@pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js (ReactRefreshEntry.js:17:1)
at options.factory (react refresh:6:1)
at __webpack_require__ (bootstrap:24:1)
at startup:4:66
at __webpack_require__.O (chunk loaded:25:1)
at startup:9:1
at startup:9:1

Он даже не загружает мой Javascript, так как кажется, что он сломался в более ранний момент.

Я уже менял версии узлов туда и обратно, удалял все модули узлов и package-lock.json, удалял весь свой Javascript, чтобы посмотреть, решает ли это что-нибудь, но это не так.

Моя установка: Локальная от Flyhweel как локальная среда Wordpress Wordpress: 6.0.3Node V 16.18.0npm 8.19.2@wordpress/scripts Версия: 24.4.0

wp-config.php:define('WP_DEBUG', false); define('SCRIPT_DEBUG', true);

Также я установил и активировал плагин Gutenberg, как указано здесь: https://developer.wordpress.org/block-editor/reference-guides/packages/packages-scripts/#:~:text=%2D%2Dhot%20% E2%80%93%20включает%20%E2%80%9CFast%20Обновить%E2%80%9D.%20%20страница%20будет%20автоматически%20перезагружать%20если%20вы%20внесите%20изменения%20на%20%20код.% 20Для%20сейчас%2C%20это%20требуется%20что%20WordPress%20 имеет%20%20SCRIPT_DEBUG%20flag%20включен%20и%20%20Gutenberg%20плагин%20установлен .

Кто-нибудь еще испытывает эту ошибку или может кто-нибудь помочь с этим?

Большое спасибо и ура Йоханнес

Источник

2 ответа

Альтернатива

Я не мог получитьreact-refresh-webpack-pluginдля работы в @worpress/script, поэтому в итоге использовалBrowserSyncPlugin, вот как я расширил конфигурацию веб-пакета @wordpress/script. Надеюсь, это поможет кому-то

      
/**
 * External Dependencies
 */
const path = require('path');
const BrowserSyncPlugin = require('browser-sync-webpack-plugin');

/**
 * WordPress Dependencies
 */
const defaultConfig = require('@wordpress/scripts/config/webpack.config.js');


module.exports = {
  ...defaultConfig,
  ...{
    entry: {
      theme: path.resolve(process.cwd(), 'src', 'theme.js'),
    },
    plugins: [
      ...defaultConfig.plugins,

      new BrowserSyncPlugin({
        // inspect docker network to get this container external ip
        // then specify it in host
        host: '172.44.0.3', //docker container host
        port: 8887,
        //server: { baseDir: ['public'] },
        proxy: 'http://172.44.0.1:7020/', //docker container host
        open: false
      }),
    ]
  }
}

иyarn run start

Отказ от ответственности: я разрабатываю в docker env. я знаю, что это не ответ на вопрос, но если вы застряли, пожалуйста, попробуйте.

Источник

Я столкнулся с той же проблемой, и исправить ее легко. Как указано здесь, вам необходимо установить флаг SCRIPT_DEBUG: https://github.com/WordPress/gutenberg/tree/trunk/packages/scripts#start .

Добавьте в wp-config.php

      define('SCRIPT_DEBUG', true);
Источник
Другие вопросы по тегам