Process.binding 未在 Gatsby + web3 中定义
Process.binding is not defined in Gatsby + web3
我正在使用 web3 在 Gatsby 上开发一个网络应用程序,我遇到了 process.binding 未定义的问题。开发工作正常但构建不工作。
我知道这是因为 process/browser 没有“绑定”,事实上我不应该使用 Node.js 函数,但因为它是 web3,应该在浏览器中工作 - 我不是确定要做什么。
如有任何指示,我们将不胜感激。一直在用头撞墙。
ERROR
Page data from page-data.json for the failed page "/[...]/": {
"componentChunkName": "component---src-pages-js",
"path": "/[...]/",
"result": {
"pageContext": {}
},
"staticQueryHashes": [],
"matchPath": "/*"
}
failed Building static HTML for pages - 3.268s
ERROR #95313
Building static HTML failed for path "/[...]/"
See our docs page for more info on this error: https://gatsby.dev/debug-html
175 |
176 | process.binding = function (name) {
> 177 | throw new Error('process.binding is not supported');
| ^
178 | };
179 |
180 | process.cwd = function () { return '/' };
WebpackError: process.binding is not supported
- browser.js:177
[artcart-buyers]/[process]/browser.js:177:1
- index.js:7
[artcart-buyers]/[fs-minipass]/index.js:7:24
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- create.js:8
[artcart-buyers]/[tar]/lib/create.js:8:13
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- index.js:4
[artcart-buyers]/[tar]/index.js:4:13
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- files.js:19
[artcart-buyers]/[swarm-js]/lib/files.js:19:11
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- api-node.js:3
[artcart-buyers]/[swarm-js]/lib/api-node.js:3:13
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- index.js:23
[artcart-buyers]/[web3-bzz]/lib/index.js:23:13
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- index.js:34
[artcart-buyers]/[web3]/lib/index.js:34:11
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- static-entry.js:212
artcart-buyers/.cache/static-entry.js:212:27
- Tokenizer.js:26
[artcart-buyers]/[stylis]/src/Tokenizer.js:26:1
[...].js 的代码:
import React from "react"
import { Auth0Provider } from "../utils/auth"
import DataContextProvider from "../utils/dataStore";
import EthereumContextProvider from "../utils/ethereumContext";
import { Router } from "@reach/router"
import PrivateRoute from "../components/PrivateRoute"
import Nft from '../components/pages/Nft'
import Transactions from '../components/pages/Transactions'
import Index from '../components/pages/Index'
import Account from '../components/pages/Account'
import "@ethersproject/shims"
const App = ({ element, location }) => {
const isBrowser = typeof window !== "undefined"
const onRedirectCallback = appState => {
location.navigate(
appState && appState.targetUrl
? appState.targetUrl
: window.location.pathname
)
}
if (isBrowser) {
return (
<>
<EthereumContextProvider>
<Auth0Provider
domain={process.env.GATSBY_AUTH0_DOMAIN}
client_id={process.env.GATSBY_AUTH0_CLIENTID}
redirect_uri={window.location.origin}
cacheLocation='localstorage'
onRedirectCallback={onRedirectCallback}
>
<DataContextProvider>
<Router>
<PrivateRoute path="/" component={Index} />
<PrivateRoute path="/nft" component={Nft} />
<PrivateRoute path="/transactions" component={Transactions} />
<PrivateRoute path="/account" component={Account} />
</Router>
</DataContextProvider>
</Auth0Provider>
</EthereumContextProvider>
</>
)
}
else {
return (
<></>
)
}
}
export default App
A-a-在发布问题后我找到了解决方案。所以对于遇到同样问题的其他人:
尝试使用 ethers 库而不是 web3。为我工作。
我正在使用 web3 在 Gatsby 上开发一个网络应用程序,我遇到了 process.binding 未定义的问题。开发工作正常但构建不工作。
我知道这是因为 process/browser 没有“绑定”,事实上我不应该使用 Node.js 函数,但因为它是 web3,应该在浏览器中工作 - 我不是确定要做什么。
如有任何指示,我们将不胜感激。一直在用头撞墙。
ERROR
Page data from page-data.json for the failed page "/[...]/": {
"componentChunkName": "component---src-pages-js",
"path": "/[...]/",
"result": {
"pageContext": {}
},
"staticQueryHashes": [],
"matchPath": "/*"
}
failed Building static HTML for pages - 3.268s
ERROR #95313
Building static HTML failed for path "/[...]/"
See our docs page for more info on this error: https://gatsby.dev/debug-html
175 |
176 | process.binding = function (name) {
> 177 | throw new Error('process.binding is not supported');
| ^
178 | };
179 |
180 | process.cwd = function () { return '/' };
WebpackError: process.binding is not supported
- browser.js:177
[artcart-buyers]/[process]/browser.js:177:1
- index.js:7
[artcart-buyers]/[fs-minipass]/index.js:7:24
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- create.js:8
[artcart-buyers]/[tar]/lib/create.js:8:13
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- index.js:4
[artcart-buyers]/[tar]/index.js:4:13
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- files.js:19
[artcart-buyers]/[swarm-js]/lib/files.js:19:11
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- api-node.js:3
[artcart-buyers]/[swarm-js]/lib/api-node.js:3:13
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- index.js:23
[artcart-buyers]/[web3-bzz]/lib/index.js:23:13
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- index.js:34
[artcart-buyers]/[web3]/lib/index.js:34:11
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- bootstrap:19
artcart-buyers/webpack/bootstrap:19:1
- static-entry.js:212
artcart-buyers/.cache/static-entry.js:212:27
- Tokenizer.js:26
[artcart-buyers]/[stylis]/src/Tokenizer.js:26:1
[...].js 的代码:
import React from "react"
import { Auth0Provider } from "../utils/auth"
import DataContextProvider from "../utils/dataStore";
import EthereumContextProvider from "../utils/ethereumContext";
import { Router } from "@reach/router"
import PrivateRoute from "../components/PrivateRoute"
import Nft from '../components/pages/Nft'
import Transactions from '../components/pages/Transactions'
import Index from '../components/pages/Index'
import Account from '../components/pages/Account'
import "@ethersproject/shims"
const App = ({ element, location }) => {
const isBrowser = typeof window !== "undefined"
const onRedirectCallback = appState => {
location.navigate(
appState && appState.targetUrl
? appState.targetUrl
: window.location.pathname
)
}
if (isBrowser) {
return (
<>
<EthereumContextProvider>
<Auth0Provider
domain={process.env.GATSBY_AUTH0_DOMAIN}
client_id={process.env.GATSBY_AUTH0_CLIENTID}
redirect_uri={window.location.origin}
cacheLocation='localstorage'
onRedirectCallback={onRedirectCallback}
>
<DataContextProvider>
<Router>
<PrivateRoute path="/" component={Index} />
<PrivateRoute path="/nft" component={Nft} />
<PrivateRoute path="/transactions" component={Transactions} />
<PrivateRoute path="/account" component={Account} />
</Router>
</DataContextProvider>
</Auth0Provider>
</EthereumContextProvider>
</>
)
}
else {
return (
<></>
)
}
}
export default App
A-a-在发布问题后我找到了解决方案。所以对于遇到同样问题的其他人:
尝试使用 ethers 库而不是 web3。为我工作。