Uncaught ReferenceError: буфер не определен

avatar
whileone
9 августа 2021 в 06:14
32742
7
26

Наше приложение постоянно показывало ошибку в заголовке. Проблема, скорее всего, связана с полифиллом Webpack 5, и после нескольких решений:

  1. Настройка отката + установка с помощью npm
fallback: {
  "stream": require.resolve("stream-browserify"),
  "buffer": require.resolve("buffer/")
}
  1. Настройка псевдонима
alias: {
  "buffer": "buffer",
  "stream": "stream-browserify"
}

Мы все еще видим ужасную ошибку:

rfc6979.js:3 Uncaught ReferenceError: Buffer is not defined
    at Object.4142 (rfc6979.js:3)
    at r (bootstrap:19)
    at Object.5892 (js.js:4)
    at r (bootstrap:19)
    at Object.4090 (bip32.js:5)
    at r (bootstrap:19)
    at Object.7786 (index.js:3)
    at r (bootstrap:19)
    at Object.1649 (MnemonicKey.js:50)
    at r (bootstrap:19)

Наша установка — это vanilla NodeJS + TypeScript + Webpack для нескольких целей: узел + браузер. Любая помощь будет здоровой!

Источник

Ответы (7)

avatar
whileone
10 августа 2021 в 08:15
55

Отвечаю на свой вопрос. Две вещи помогли решить проблему:

  1. Добавление раздела плагинов с ProviderPlugin в webpack.config.js
const webpack = require('webpack');

module.exports = {
    // ...

    plugins: [
        // Work around for Buffer is undefined:
        // https://github.com/webpack/changelog-v5/issues/10
        new webpack.ProvidePlugin({
            Buffer: ['buffer', 'Buffer'],
        }),
        new webpack.ProvidePlugin({
            process: 'process/browser',
        }),
    ],
  1. Также добавьте в файл resolve.fallback файл webpack.config.js:
    resolve: {
        extensions: [ '.ts', '.js' ],
        fallback: {
            "stream": require.resolve("stream-browserify"),
            "buffer": require.resolve("buffer")
        }
    },
womp
14 ноября 2021 в 08:28
0

спасибо! Рвал на себе волосы, пытаясь запустить проект Vue3.

whileone
15 ноября 2021 в 14:24
6

@womp нп. может полностью относиться. Я уже лысый.

Evan
5 января 2022 в 01:04
0

тоже чувствую тебя, это неприятная ошибка

Caner
15 января 2022 в 08:20
0

Большое тебе спасибо, чувак, я бился лысой головой о стены... ты заставил меня остановиться!

tonisives
1 февраля 2022 в 10:01
2

Я использую реактивные сценарии 5, и это решение не работает для меня. Я попытался использовать react-app-rewired для добавления config-overrides.js, как описано. Но приложение все еще не находит буфер

jfrumar
1 февраля 2022 в 21:01
1

Обратите внимание @tonisives, что вам может понадобиться очистить кеш после этого изменения - rm -fr node_modules/.cache

tonisives
2 февраля 2022 в 00:11
0

Спасибо! Мне удалось это исправить, добавив yarn add process Вот мой полный обзор github.com/terra-money/terra.js/issues/223

Robin Curbelo
6 февраля 2022 в 20:51
0

спасибо! ты спас мой день

Rob Angelier
7 февраля 2022 в 14:28
0

Вы сэкономили мне еще один день исследований, спасибо, сэр.

Rohit Kaushal
8 февраля 2022 в 11:37
0

не могли бы вы помочь мне решить эту проблему в vite - реагировать (он не использует веб-пакет).

Liki Crus
14 марта 2022 в 05:21
0

Привет, @whileone, не могли бы вы подсказать, как настроить этот параметр на CRACO 6? Заранее спасибо.

avatar
Wells
14 мая 2022 в 20:59
0

Я обнаружил ошибку, когда пытался использовать TonWebSDK с приложением create-react-app, и нашел для нее исправление.

После настройки проекта с помощью npx create-react-app my-app я импортировал tonweb from 'tonweb', но столкнулся с ошибкой Uncaught ReferenceError: Buffer is not defined.

Я запускаю npm run eject, чтобы изменить конфигурацию веб-пакета. Я добавил поддержку буфера в plugins веб-пакета со следующими строками: 

 new webpack.ProvidePlugin({
          Buffer: ['buffer', 'Buffer'],
        })

И это сработало для меня.

avatar
parliament
21 апреля 2022 в 11:28
1

Я перепробовал все ответы здесь, чтобы решить эту проблему, но ничего не помогло. Что сработало для меня, так это добавить в мой polyfills.ts следующее: 

import { Buffer } from 'buffer';

// @ts-ignore
window.Buffer = Buffer;

и, конечно же, npm install --save buffer

avatar
Yulian
17 марта 2022 в 15:41
1

У меня сработало следующее:

Первый:

npm install --save buffer

Затем:

// webpack.config.js
const webpack = require("webpack");

module.exports = {
  plugins: {
    new webpack.ProvidePlugin({
      Buffer: ['buffer', 'Buffer'],
    }),
    // ..
  }
  // ..
}
avatar
sirKris van Dela
24 февраля 2022 в 23:38
0

Вы также можете просто установить следующую библиотеку: https://github.com/feross/buffer

yarn add buffer

avatar
Paul
21 февраля 2022 в 10:50
14

Все, кто пришел сюда из-за react-scripts (5.0.0) (@whileons отвечает правильно, это только конфигурация для react-scripts):

Сначала добавьте эти зависимости в ваш package.json:

"buffer": "^6.0.3",
"process": "^0.11.10",
"stream-browserify": "^3.0.0"
"react-app-rewired": "^2.2.1" --dev

Обновите сценарии package.json.

До:

"scripts": {
    "debug": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
},

После

  "scripts": {
    "debug": "react-app-rewired start",
    "build": "react-app-rewired build",
    "test": "react-app-rewired test",
    "eject": "react-app-rewired eject"
  },

Создайте файл config-overrides.js в корневой папке (НЕ в src, в той же папке, что и ваш package.json) и вставьте внутрь следующий код: 

const webpack = require("webpack")

module.exports = function override(config, env) {
    //do stuff with the webpack config...
    config.resolve.fallback = {
        ...config.resolve.fallback,
        stream: require.resolve("stream-browserify"),
        buffer: require.resolve("buffer"),
    }
    config.resolve.extensions = [...config.resolve.extensions, ".ts", ".js"]
    config.plugins = [
        ...config.plugins,
        new webpack.ProvidePlugin({
            process: "process/browser",
            Buffer: ["buffer", "Buffer"],
        }),
    ]
    // console.log(config.resolve)
    // console.log(config.plugins)

    return config
}

Не забудьте снова удалить node_modules и npm install.

Adam M Thompson
25 февраля 2022 в 18:20
1

Кажется, это работает для меня. Просто хотел указать, что имя файла должно быть config-overrides.js (множественное число)

Learner
30 марта 2022 в 00:57
0

Очень полезно, я забыл следовать последней строке Удалить node_modules. Но, наконец, удалил node_modules и снова установил, чтобы все заработало.

avatar
nnsk
19 февраля 2022 в 09:16
0

Понижение реактивных скриптов до 4.0.3 сработало https://github.com/terra-money/terra.js/issues/223. Возможно, это не оптимальное решение, но мне оно помогло.