Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Prod build error with urql React bindings on React 19 with rsbuild #3762

Open
3 tasks done
justin13888 opened this issue Mar 11, 2025 · 0 comments
Open
3 tasks done

Comments

@justin13888
Copy link

Describe the bug

I get the following error when doing prod builds in rsbuild from urql specifically when using React 19.

Although I don't get this issue when changing any of these variables (e.g. dev build, downgrading to React 18, same React components but compiled with Vite), I am submitting the issue here because of the type of error:

File: <...>/node_modules/urql/dist/urql.es.js:1:1
  × ESModulesLinkingError: export '__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED' (imported as 'r') was not found in 'react' (possible exports: Children, Component, Fragment, Profiler, PureComponent, StrictMode, Suspense, __CLIENT_INTERNALS_DO_NOT_USE_OR_WARN_USERS_THEY_CANNOT_UPGRADE, act, cache, cloneElement, createContext, createElement, createRef, forwardRef, isValidElement, lazy, memo, startTransition, unstable_useCacheRefresh, use, useActionState, useCallback, useContext, useDebugValue, useDeferredValue, useEffect, useId, useImperativeHandle, useInsertionEffect, useLayoutEffect, useMemo, useOptimistic, useReducer, useRef, useState, useSyncExternalStore, useTransition, version)
    ╭─[73:8]
 71 │ };
 72 │ 
 73 │ var p = r.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;

It appears urql hooks into React's internal API for something which from my understanding is unsupported by the React team (reactjs/react.dev#3896 (comment)).

Wondering if there are any leads on how this could be resolved whether by urql or some other way?

Reproduction:
A simple code example from documentation suffices given that you are using rsbuild to compile React 19 triggers this error: https://commerce.nearform.com/open-source/urql/docs/basics/react-preact/

List of steps:

  • Create rsbuild project with React 19 template: npm create rsbuild@latest

  • cd into project

  • npm install --save urql

  • Modify src/App.tsx as follows:

    import './App.css';
    
    import { Client, Provider, cacheExchange, fetchExchange } from 'urql';
    
    const client = new Client({
      url: 'http://localhost:3000/graphql',
      exchanges: [cacheExchange, fetchExchange],
    });
    
    const App = () => {
      return (
        <Provider value={client}>    
          <div className="content">
            <h1>Rsbuild with React</h1>
            <p>Start building amazing things with Rsbuild.</p>
          </div>
        </Provider>
      );
    };
    
    export default App;
  • npm run build

Reproduction

See above

Urql version

4.2.2

Validations

  • I can confirm that this is a bug report, and not a feature request, RFC, question, or discussion, for which GitHub Discussions should be used
  • Read the docs.
  • Follow our Code of Conduct
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant