search

Uniswap / web3-react

A simple, maximally extensible, dependency minimized framework for building modern Ethereum dApps
https://web3-react-mu.vercel.app/
GNU General Public License v3.0
5.54k stars 1.52k forks source link

Module parse failed: Unexpected token (59:10) #782

Open hwnahm opened 1 year ago

hwnahm commented 1 year ago

My React project got this error :

  ./node_modules/@web3-react/walletconnect-v2/node_modules/@walletconnect/ethereum-provider/dist/index.es.js 59:10
  Module parse failed: Unexpected token (59:10)
  File was processed with these loaders:
   * ./node_modules/react-scripts/node_modules/babel-loader/lib/index.js
  You may need an additional loader to handle the result of these loaders.
  |       rpcMap: b
  |     },
  >     d = n?.filter(g => !u.includes(g)),
  |     l = i?.filter(g => !p.includes(g));
  |   if (!s && !c && !e && !(d != null && d.length) && !(l != null && l.length)) return {
mohandast52 commented 1 year ago

I am having a similar problem in a storybook, please let me know if you got a solution to it?


Module parse failed: Unexpected token (1:1028)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> import{disconnect as d,getAccount as u,watchAccount as w,fetchBalance as C,getNetwork as m,watchNetwork as p,switchNetwork as f,fetchEnsName as g,fetchEnsAvatar as v,connect as h,InjectedConnector as y}from"@wagmi/core";import{WalletConnectConnector as I}from"@wagmi/connectors/walletConnect";import{WalletConnectLegacyConnector as W}from"@wagmi/core/connectors/walletConnectLegacy";import{jsonRpcProvider as E}from"@wagmi/core/providers/jsonRpc";const P="wallet_addEthereumChain";class L{constructor(n,t){this.wagmi={},this.walletConnectVersion=1,this.chains=[],this.namespace="eip155",this.disconnect=d,this.getAccount=u,this.watchAccount=w,this.fetchBalance=C,this.getNetwork=m,this.watchNetwork=p,this.switchNetwork=f,this.fetchEnsName=g,this.fetchEnsAvatar=v,this.wagmi=n,this.chains=t;const{isV2:e}=this.getWalletConnectConnectors();this.walletConnectVersion=e?2:1}getWalletConnectConnectors(){const n=this.wagmi.connectors.find(o=>o.id==="walletConnect"),t=this.wagmi.connectors.find(o=>o.id==="walletConnectLegacy"),e=n??t;if(!e)throw new Error("WalletConnectConnector or WalletConnectLegacyConnector is required");return{isV2:!!n,connector:e}}async connectWalletConnectV1(n,t){return new Promise((e,o)=>{n.once("message",async({type:i})=>{if(i==="connecting"){const c=(await n.getProvider()).connector;t(c.uri),c.on("disconnect",()=>{o(Error())}),c.on("connect",()=>{e()})}})})}async connectWalletConnectV2(n,t){return await n.getProvider(),new Promise(e=>{n.once("message",o=>{o.type==="display_uri"&&(t(o.data),e())})})}getConnectorById(n){const t=this.wagmi.connectors.find(e=>e.id===n);if(!t)throw new Error(`Connector for id ${n} was not found`);return t}getConnectors(){return this.wagmi.connectors.filter(n=>!n.id.includes("walletConnect"))}async connectWalletConnect(n,t){const{connector:e,isV2:o}=this.getWalletConnectConnectors(),i={connector:e};t&&(i.chainId=t);const c=o?this.connectWalletConnectV2.bind(this):this.connectWalletConnectV1.bind(this);return Promise.all([h(i),c(e,n)])}async connectConnector(n,t){const e={connector:this.getConnectorById(n)};return t&&(e.chainId=t),await h(e)}isInjectedProviderInstalled(){return typeof window.ethereum<"u"}safeCheckInjectedProvider(n){var t;try{const e=String(n);return!!((t=window.ethereum)!=null&&t[e])}catch(e){return console.error(e),!1}}async getConnectedChainIds(){var n,t,e;const{connector:o,isV2:i}=this.getWalletConnectConnectors();if(i){const c=(t=(n=(await o.getProvider()).signer)==null?void 0:n.session)==null?void 0:t.namespaces,l=(e=c?.[this.namespace])==null?void 0:e.methods;if(l!=null&&l.includes(P))return"ALL";if(c){const a=[];return Object.keys(c).forEach(s=>{s.includes(this.namespace)&&a.push(...c[s].accounts)}),a?.map(s=>s.split(":")[1])}}return"ALL"}}const k="eip155";function b({projectId:r}){return E({rpc:n=>{var t;return[1,3,4,5,10,42,56,69,97,100,137,280,324,420,42161,42220,43114,80001,421611,421613,1313161554,1313161555].includes(n.id)?{http:`https://rpc.walletconnect.com/v1/?chainId=${k}:${n.id}&projectId=${r}`}:{http:n.rpcUrls.default.http[0],webSocket:(t=n.rpcUrls.default.webSocket)==null?void 0:t[0]}}})}function B({chains:r,version:n,projectId:t}){const e=n===1,o=[new y({chains:r})];return e?o.unshift(new W({chains:r,options:{qrcode:!1}})):o.unshift(new I({chains:r,options:{projectId:t,showQrModal:!1}})),o}export{L as EthereumClient,B as w3mConnectors,b as w3mProvider};
| //# sourceMappingURL=index.js.map
| 
 @ ./src/components/common/LoginV2/LoginV2.tsx 4:0-81 21:48-59 27:14-27 34:25-39
 @ ./src/components/common/LoginV2/LoginV2.stories.tsx
 @ ./src sync ^\.(?:(?:^|\/|(?:(?:(?!(?:^|\/)\.).)*?)\/)(?!\.)(?=.)[^/]*?\.stories\.tsx)$
 @ ./generated-stories-entry.js
 @ multi ./node_modules/@storybook/core-client/dist/esm/globals/polyfills.js ./node_modules/@storybook/core-client/dist/esm/globals/globals.js (webpack)-hot-middleware/client.js?reload=true&quiet=false&noInfo=undefined ./storybook-init-framework-entry.js ./node_modules/@storybook/react/dist/esm/client/docs/config-generated-config-entry.js ./node_modules/@storybook/react/dist/esm/client/preview/config-generated-config-entry.js ./node_modules/@storybook/addon-docs/preview.js-generated-config-entry.js ./node_modules/@storybook/addon-actions/preview.js-generated-config-entry.js ./node_modules/@storybook/addon-backgrounds/preview.js-generated-config-entry.js ./node_modules/@storybook/addon-measure/preview.js-generated-config-entry.js ./node_modules/@storybook/addon-outline/preview.js-generated-config-entry.js ./node_modules/@storybook/addon-links/preview.js-generated-config-entry.js ./node_modules/@storybook/addon-a11y/preview.js-generated-config-entry.js ./.storybook/preview.js-generated-config-entry.js ./generated-stories-entry.js```
binhntfiber commented 1 year ago

Have similar problem

chris13524 commented 1 year ago

@binhntfiber are you having this issue on the latest version of web3-react?

kr-unnati commented 1 year ago

./node_modules/@web3-react/walletconnect-v2/node_modules/@walletconnect/ethereum-provider/dist/index.es.js 59:10 Module parse failed: Unexpected token (59:10) File was processed with these loaders:

I am getting this error with the @web3-react/walletconnect-v2@8.3.6

binhntfiber commented 1 year ago

@binhntfiber are you having this issue on the latest version of web3-react?

Hi Chris, i figured the issue out, the error happened because of WalletConnect source code, they use optional chaining and nullish-coalescing in their code base.

This is the original issue: https://github.com/WalletConnect/walletconnect-monorepo/issues/1973

I attempted to change the webpack config as linked issue but it didn't work for me. Maybe i should upgrade my project to es6 and use another build tool.