Блог

Я использую этот плагин для HMR: https://www.npmjs.com/package/@pmmmwh/react-refresh-webpack-plugin.

Как я могу запретить отображение страницы из-за ошибок, не допускающих прерывания?

Например, проблемы с ворсом.

Моя настройка в значительной степени скопирована с их примера:

 const ReactRefreshWebpackPlugin = require('@pmmmwh/react-refresh-webpack-plugin');
const webpack = require('webpack');
// ... your other imports
 
const isDevelopment = process.env.NODE_ENV !== 'production';
 
module.exports = {
  // It is suggested to run both `react-refresh/babel` and the plugin in the `development` mode only,
  // even though both of them have optimisations in place to do nothing in the `production` mode.
  // If you would like to override Webpack's defaults for modes, you can also use the `none` mode -
  // you then will need to set `forceEnable: true` in the plugin's options.
  mode: isDevelopment ? 'development' : 'production',
  module: {
    rules: [
      // ... other rules
      {
        test: /.[jt]sx?$/,
        exclude: /node_modules/,
        use: [
          // ... other loaders
          {
            loader: require.resolve('babel-loader'),
            options: {
              // ... other options
              plugins: [
                // ... other plugins
                isDevelopment amp;amp; require.resolve('react-refresh/babel'),
              ].filter(Boolean),
            },
          },
        ],
      },
    ],
  },
  plugins: [
    // ... other plugins
    isDevelopment amp;amp; new webpack.HotModuleReplacementPlugin(),
    isDevelopment amp;amp; new ReactRefreshWebpackPlugin(),
  ].filter(Boolean),
  // ... other configuration options
};
 

Я пропустил это в документах по API:

 new ReactRefreshWebpackPlugin({ overlay: false })