Skip to content

Top-level await disables Nextjs HMR #158

@rnbrady

Description

@rnbrady

Using Libauth in a Nextjs project disables Fast Refresh, the successor to hot module reloading (HMR).

Image

This seems to be triggered by the top-level await in src/lib/crypto/default-crypto-instances.ts. It seems to be a known issue with Nextjs and is only a DX issue and only when when working on interactive frontends such as Cashflow.

The issue is reproduced in this repo.

It doesn't help to bypass the default crypto instances like this:

import { instantiateSha256 } from "@bitauth/libauth/build/lib/crypto/sha256";
import { binToHex } from "@bitauth/libauth/build/lib/format/hex";

Perhaps the main entry point of the package is run to create the tree prior to tree shaking.

A workaround is to use Libauth v1. This must be done for dependencies that use Libauth too:

  "dependencies": {
    "@bitauth/libauth": "^1.19.1",
  },
  "pnpm": {
    "overrides": {
      "chaingraph-ts>@bitauth/libauth": "^1.19.1"
    }
  },

For an example see Cashflow, which also required a workaround to the workaround.

Raising here for discussion and will create a new issue with Nextjs too.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions