> ## Documentation Index
> Fetch the complete documentation index at: https://ckbfans.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# FAQ

> Answers to common questions about using CCC — TypeScript configuration, React Server Components, wallet support, and more.

<AccordionGroup>
  <Accordion title="Property '*' does not exist on type 'typeof import(...)'" icon="triangle-exclamation">
    CCC uses JavaScript's [Package Entry Points](https://nodejs.org/api/packages.html#packages_package_entry_points) feature to enable tree shaking while exporting everything on the `ccc` object. If TypeScript cannot find a property, check your `tsconfig.json`:

    * Set `moduleResolution` to `node16`, `nodenext`, or `bundler`.
    * Do not disable `resolvePackageJsonExports`.

    ```json tsconfig.json theme={null}
    {
      "compilerOptions": {
        "moduleResolution": "bundler"
      }
    }
    ```

    See the [TypeScript guide on `package.json` exports](https://www.typescriptlang.org/docs/handbook/modules/reference.html#packagejson-exports) for more detail.
  </Accordion>

  <Accordion title="TypeError: (0, react....createContext) is not a function" icon="triangle-exclamation">
    CCC's UI components run on the client side only. If you are using [React Server Components](https://react.dev/reference/rsc/use-client), add the `"use client"` directive at the top of any file that renders `ccc.Provider`:

    ```tsx theme={null}
    "use client";

    import { ccc } from "@ckb-ccc/connector-react";

    export function Providers({ children }: { children: React.ReactNode }) {
      return <ccc.Provider>{children}</ccc.Provider>;
    }
    ```
  </Accordion>

  <Accordion title="Can I use Lumos with CCC?" icon="circle-question">
    Yes. CCC provides the `@ckb-ccc/lumos-patches` package to add support for JoyID, Nostr, and Portal wallets inside Lumos-based projects.

    Install the package:

    ```bash theme={null}
    npm install @ckb-ccc/lumos-patches
    ```

    Apply the patches before calling any Lumos APIs:

    ```typescript theme={null}
    import { generateDefaultScriptInfos } from "@ckb-ccc/lumos-patches";

    // Call this before using Lumos. You no longer need @ckb-lumos/joyid.
    registerCustomLockScriptInfos(generateDefaultScriptInfos());
    ```
  </Accordion>

  <Accordion title="Which wallets does CCC support?" icon="wallet">
    CCC supports wallets from multiple ecosystems through a unified signer interface:

    | Ecosystem  | Wallets                                    |
    | ---------- | ------------------------------------------ |
    | EVM        | MetaMask, and other EVM-compatible wallets |
    | Bitcoin    | UniSat, OKX, UTXO Global, Xverse           |
    | CKB native | JoyID                                      |
    | Nostr      | NIP-07 compatible extensions               |
    | Dogecoin   | Doge-compatible wallets                    |

    All wallets connect through the same `ccc.Signer` interface, so your transaction logic works regardless of which wallet the user chooses.
  </Accordion>

  <Accordion title="How do I switch between mainnet and testnet?" icon="arrow-right-arrow-left">
    Pass the appropriate client when constructing your signer or provider.

    **With the React connector**, set the `defaultClient` prop on `ccc.Provider`, or call `setClient()` from the `useCcc()` hook at runtime:

    ```tsx theme={null}
    import { ccc } from "@ckb-ccc/connector-react";

    // Switch network at runtime
    function NetworkSwitcher() {
      const { setClient } = ccc.useCcc();

      return (
        <>
          <button onClick={() => setClient(new ccc.ClientPublicMainnet())}>
            Mainnet
          </button>
          <button onClick={() => setClient(new ccc.ClientPublicTestnet())}>
            Testnet
          </button>
        </>
      );
    }
    ```

    **Without React**, pass the client directly:

    ```typescript theme={null}
    import { ccc } from "@ckb-ccc/ccc";

    const client = new ccc.ClientPublicTestnet();
    // or
    const client = new ccc.ClientPublicMainnet();
    ```
  </Accordion>

  <Accordion title="What is the difference between @ckb-ccc/ccc and @ckb-ccc/connector-react?" icon="circle-question">
    * **`@ckb-ccc/connector-react`** includes everything in `@ckb-ccc/ccc` plus React-specific additions: the `ccc.Provider` component, the `useCcc()` hook, and a pre-built wallet selection UI. Use this package in React apps.

    * **`@ckb-ccc/ccc`** is the framework-agnostic core. Use it when you are building a custom wallet connection UI, working in a non-React environment, or want full control over how signers are managed.

    If you are not using React, `@ckb-ccc/ccc` is the right starting point. See the [packages overview](/packages/overview) for a full comparison.
  </Accordion>
</AccordionGroup>