Начиная с версии 5, webpack больше не заполняет автоматически основные модули Node.js. Если у вас есть код, который зависит от модулей, таких как fs, path и т. д., или у вас есть зависимости, требующие этих модулей, ваш код сломается при использовании или обновлении до веб-пакета 5+. С одной стороны, имеет смысл не всегда включать эти ориентированные на бэкэнд модули, но с другой стороны, это может сильно раздражать! К счастью, это довольно легко исправить.

Решение

Просто установите пакеты, которые выполняют требуемый pollyfill, вручную в конфигах resolve.fallback webpack.config.js. См. пример в документации webpack:



Решение | webpack
Эти параметры изменяют способ разрешения модулей. Webpack предоставляет разумные значения по умолчанию, но можно изменить…webpack.js.org



Например, если вам нужен модуль fs для доступа к файловой системе, просто:

  1. Установите browserify-fs: npm install browserify-fs
  2. Добавьте fs в резервную конфигурацию:
module.exports = {
  //...
  resolve: {
    fallback: {
      fs: require.resolve('browserify-fs'),
    },
  },
};

Технологический модуль

Для модуля процесса это нужно обрабатывать немного по-другому. Вместо этого использует конфигурацию resolve.alias без установки какого-либо пакета:

module.exports = {
  //...
  resolve: {
    alias: {
       process: "process/browser"
    }
  },
};

Использование node-polyfill-webpack-плагина

В качестве альтернативы мы также можем установить node-polyfill-webpack-plugin. Этот плагин, по сути, делает работу с псевдонимами для нас в webpack. Он также предоставляет удобные параметры для выбора модулей, которые следует включить или исключить. Однако некоторые модули, такие как fs, не включены, и нам все равно придется импортировать их самим.

При использовании node-polyfill-webpack-plugin вы можете исключить модули, являющиеся частью веб-API, которые уже поддерживаются браузерами, такие как console или Buffer.