ReferenceError: Buffer is not defined #23718
Janaka-Steph
started this conversation in
General
Replies: 1 comment 17 replies
-
|
How to reproduce this? I see this when I run component testing: I don't know how to start the e2e server - can you describe how to reproduce this problem? |
Beta Was this translation helpful? Give feedback.
17 replies
-
|
There is around 6 similar issues in their repo: https://github.com/bitcoinjs/tiny-secp256k1/issues?q=is%3Aissue+react They also have a react example: https://github.com/bitcoinjs/tiny-secp256k1/tree/master/examples/react-app I wonder if you need to build it? I guess that would run on the npm Just throwing out ideas. Hmm... |
Beta Was this translation helpful? Give feedback.
-
|
Next step would be a console.log just before I tried: console.log(JSON.stringify(options,null, 2))
on('file:preprocessor', webpackPreprocessor(options));Yields this... you know your config better than I do, anything weird here? If you can diff this and the craco config used in prod, that might be your best bet. {
"webpackOptions": {
"target": [
"browserslist"
],
"stats": "errors-warnings",
"mode": "development",
"bail": false,
"devtool": "cheap-module-source-map",
"entry": "/home/lachlan/code/dump/tdex-app/src/index.tsx",
"output": {
"publicPath": ""
},
"cache": {
"type": "filesystem",
"version": "56e655ab29e15739b04e5da711108e4f",
"cacheDirectory": "/home/lachlan/code/dump/tdex-app/node_modules/.cache",
"store": "pack",
"buildDependencies": {
"defaultWebpack": [
"webpack/lib/"
],
"config": [
"/home/lachlan/code/dump/tdex-app/node_modules/react-scripts/config/webpack.config.js"
],
"tsconfig": [
"/home/lachlan/code/dump/tdex-app/tsconfig.json"
]
}
},
"infrastructureLogging": {
"level": "none"
},
"optimization": {
"minimize": false,
"minimizer": [
{
"options": {
"test": {},
"extractComments": true,
"parallel": true,
"minimizer": {
"options": {
"parse": {
"ecma": 8
},
"compress": {
"ecma": 5,
"warnings": false,
"comparisons": false,
"inline": 2
},
"mangle": {
"safari10": true,
"reserved": [
"Buffer"
]
},
"keep_classnames": false,
"keep_fnames": false,
"output": {
"ecma": 5,
"comments": false,
"ascii_only": true
}
}
}
}
},
{
"options": {
"test": {},
"parallel": true,
"minimizer": {
"options": {}
}
}
}
]
},
"resolve": {
"modules": [
"node_modules",
"/home/lachlan/code/dump/tdex-app/node_modules"
],
"extensions": [
".web.mjs",
".mjs",
".web.js",
".js",
".web.ts",
".ts",
".web.tsx",
".tsx",
".json",
".web.jsx",
".jsx"
],
"alias": {
"react-native": "react-native-web",
"src": "/home/lachlan/code/dump/tdex-app/src"
},
"plugins": [
{
"appSrcs": [
"/home/lachlan/code/dump/tdex-app/src",
"/home/lachlan/code/dump/tdex-app/node_modules/console-browserify",
"/home/lachlan/code/dump/tdex-app/node_modules/crypto-browserify",
"/home/lachlan/code/dump/tdex-app/test",
"/home/lachlan/code/dump/tdex-app/cypress"
],
"allowedFiles": {},
"allowedPaths": [
"/home/lachlan/code/dump/tdex-app/node_modules/react-refresh",
"/home/lachlan/code/dump/tdex-app/node_modules/@pmmmwh/react-refresh-webpack-plugin/lib",
"/home/lachlan/code/dump/tdex-app/node_modules/babel-preset-react-app",
"/home/lachlan/code/dump/tdex-app/node_modules/@babel/runtime/helpers/esm",
"/home/lachlan/code/dump/tdex-app/node_modules/@babel/runtime/regenerator"
]
}
],
"fallback": {
"buffer": "buffer",
"crypto": "/home/lachlan/code/dump/tdex-app/node_modules/crypto-browserify/index.js",
"fs": false,
"os": "/home/lachlan/code/dump/tdex-app/node_modules/os-browserify/browser.js",
"path": "/home/lachlan/code/dump/tdex-app/node_modules/path-browserify/index.js",
"stream": "/home/lachlan/code/dump/tdex-app/node_modules/stream-browserify/index.js",
"util": "util"
}
},
"module": {
"strictExportPresence": true,
"rules": [
{
"enforce": "pre",
"exclude": {},
"test": {},
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/source-map-loader/dist/cjs.js"
},
{
"oneOf": [
{
"test": {},
"type": "webassembly/async"
},
{
"test": {},
"include": [
"/home/lachlan/code/dump/tdex-app/src",
"/home/lachlan/code/dump/tdex-app/node_modules/@protobuf-ts/runtime",
"/home/lachlan/code/dump/tdex-app/node_modules/console-browserify",
"/home/lachlan/code/dump/tdex-app/node_modules/crypto-browserify",
"/home/lachlan/code/dump/tdex-app/test",
"/home/lachlan/code/dump/tdex-app/cypress"
],
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/babel-loader/lib/index.js",
"options": {
"customize": "/home/lachlan/code/dump/tdex-app/node_modules/babel-preset-react-app/webpack-overrides.js",
"presets": [
[
"/home/lachlan/code/dump/tdex-app/node_modules/babel-preset-react-app/index.js",
{
"runtime": "automatic"
}
]
],
"babelrc": false,
"configFile": false,
"cacheIdentifier": "development:[email protected]:[email protected]:[email protected]:[email protected]",
"plugins": [
"/home/lachlan/code/dump/tdex-app/node_modules/react-refresh/babel.js",
[
"@babel/plugin-proposal-class-properties",
{
"loose": true
}
],
[
"@babel/plugin-transform-classes",
{
"loose": true
}
]
],
"cacheDirectory": true,
"cacheCompression": false,
"compact": false
}
},
{
"test": [
{}
],
"type": "asset",
"mimetype": "image/avif",
"parser": {
"dataUrlCondition": {
"maxSize": 10000
}
}
},
{
"test": [
{},
{},
{},
{}
],
"type": "asset",
"parser": {
"dataUrlCondition": {
"maxSize": 10000
}
}
},
{
"test": {},
"use": [
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/@svgr/webpack/lib/index.js",
"options": {
"prettier": false,
"svgo": false,
"svgoConfig": {
"plugins": [
{
"removeViewBox": false
}
]
},
"titleProp": true,
"ref": true
}
},
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/file-loader/dist/cjs.js",
"options": {
"name": "static/media/[name].[hash].[ext]"
}
}
],
"issuer": {
"and": [
{}
]
}
},
{
"test": {},
"exclude": {},
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/babel-loader/lib/index.js",
"options": {
"babelrc": false,
"configFile": false,
"compact": false,
"presets": [
[
"/home/lachlan/code/dump/tdex-app/node_modules/babel-preset-react-app/dependencies.js",
{
"helpers": true
}
]
],
"cacheDirectory": true,
"cacheCompression": false,
"cacheIdentifier": "development:[email protected]:[email protected]:[email protected]:[email protected]",
"sourceMaps": true,
"inputSourceMap": true
}
},
{
"test": {},
"exclude": {},
"use": [
"/home/lachlan/code/dump/tdex-app/node_modules/style-loader/dist/cjs.js",
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/css-loader/dist/cjs.js",
"options": {
"importLoaders": 1,
"sourceMap": true,
"modules": {
"mode": "icss"
}
}
},
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/postcss-loader/dist/cjs.js",
"options": {
"postcssOptions": {
"ident": "postcss",
"config": false,
"plugins": [
"postcss-flexbugs-fixes",
[
"postcss-preset-env",
{
"autoprefixer": {
"flexbox": "no-2009"
},
"stage": 3
}
],
"postcss-normalize"
]
},
"sourceMap": true
}
}
],
"sideEffects": true
},
{
"test": {},
"use": [
"/home/lachlan/code/dump/tdex-app/node_modules/style-loader/dist/cjs.js",
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/css-loader/dist/cjs.js",
"options": {
"importLoaders": 1,
"sourceMap": true,
"modules": {
"mode": "local"
}
}
},
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/postcss-loader/dist/cjs.js",
"options": {
"postcssOptions": {
"ident": "postcss",
"config": false,
"plugins": [
"postcss-flexbugs-fixes",
[
"postcss-preset-env",
{
"autoprefixer": {
"flexbox": "no-2009"
},
"stage": 3
}
],
"postcss-normalize"
]
},
"sourceMap": true
}
}
]
},
{
"test": {},
"exclude": {},
"use": [
"/home/lachlan/code/dump/tdex-app/node_modules/style-loader/dist/cjs.js",
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/css-loader/dist/cjs.js",
"options": {
"importLoaders": 3,
"sourceMap": true,
"modules": {
"mode": "icss"
}
}
},
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/postcss-loader/dist/cjs.js",
"options": {
"postcssOptions": {
"ident": "postcss",
"config": false,
"plugins": [
"postcss-flexbugs-fixes",
[
"postcss-preset-env",
{
"autoprefixer": {
"flexbox": "no-2009"
},
"stage": 3
}
],
"postcss-normalize"
]
},
"sourceMap": true
}
},
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/resolve-url-loader/index.js",
"options": {
"sourceMap": true,
"root": "/home/lachlan/code/dump/tdex-app/src"
}
},
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/sass-loader/dist/cjs.js",
"options": {
"sourceMap": true
}
}
],
"sideEffects": true
},
{
"test": {},
"use": [
"/home/lachlan/code/dump/tdex-app/node_modules/style-loader/dist/cjs.js",
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/css-loader/dist/cjs.js",
"options": {
"importLoaders": 3,
"sourceMap": true,
"modules": {
"mode": "local"
}
}
},
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/postcss-loader/dist/cjs.js",
"options": {
"postcssOptions": {
"ident": "postcss",
"config": false,
"plugins": [
"postcss-flexbugs-fixes",
[
"postcss-preset-env",
{
"autoprefixer": {
"flexbox": "no-2009"
},
"stage": 3
}
],
"postcss-normalize"
]
},
"sourceMap": true
}
},
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/resolve-url-loader/index.js",
"options": {
"sourceMap": true,
"root": "/home/lachlan/code/dump/tdex-app/src"
}
},
{
"loader": "/home/lachlan/code/dump/tdex-app/node_modules/sass-loader/dist/cjs.js",
"options": {
"sourceMap": true
}
}
]
},
{
"exclude": [
{},
{},
{},
{}
],
"type": "asset/resource"
}
]
}
]
},
"plugins": [
{
"definitions": {
"process.env": {
"NODE_ENV": "\"development\"",
"PUBLIC_URL": "\"\"",
"FAST_REFRESH": "true"
}
}
},
{
"options": {
"overlay": false,
"exclude": {},
"include": {}
}
},
{
"options": {
"maxChunks": 1
}
}
],
"performance": false,
"ignoreWarnings": [
null
],
"experiments": {
"asyncWebAssembly": true
}
},
"watchOptions": {}
} |
Beta Was this translation helpful? Give feedback.
-
|
You are right for the wasm issue but this is fixed in the Craco config. If you run the app you will see the first page without error, it doesn't blow up with wasm error. But issue persist with Cypress. Not sure if the plugins array at the end is wrong or we are just missing info because of JSON serialization. |
Beta Was this translation helpful? Give feedback.
-
|
It's possible the serialization is breaking things. There's got to be some difference between the two configs - Cypress is just pointing at a dev server, as long as the config is correct, you'd expect it to just work... I'm running out of ideas, my next step would be a minimal project with a simple webpack config that serves wasm and see if that works as expected in Cypress. Is it this library, the config, wasm, or some combo that breaks things 🤔 |
Beta Was this translation helpful? Give feedback.
-
|
Yes |
Beta Was this translation helpful? Give feedback.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Uh oh!
There was an error while loading. Please reload this page.
-
Hello,
I have a quite complex mobile app built with Ionic, React, CRA5, using Craco to fix some Webpack issues I got with WebAssembly, Buffer, and others. The app works fine but running Cypress tests throw error
ReferenceError: Buffer is not defined.If a beautiful soul could have a look at the repo and the craco config he would for sure get a place in heaven.
https://github.com/tdex-network/tdex-app
Thank you
Beta Was this translation helpful? Give feedback.
All reactions