Use node import for 'crypto' to ease Cloudflare deploy with Vite

[mw10013]

Use node import for 'crypto' node builtin module to ease Cloudflare deploy with Vite.

Cloudflare offers some node.js compatibility if you switch it on and use the node: prefix in your imports. See: https://developers.cloudflare.com/workers/runtime-apis/nodejs/

This eases Remix deployment with the Vite compiler since no additional Vite configuration is needed. Otherwise, you may need to specify resolve.alias's and srr.noExternal's, which can get tricky if totp is a dependency of a dependency as is the case for remix-auth-totp.

Note that version 3 of remix-auth-totp will include a similar change. (dev-xo/remix-auth-totp#45)

[kentcdodds]

I typically prefer my node imports to be like this anyway so that works out nicely! I'm glad to hear this makes cloudflare support easier as well. Thanks!

[github-actions]

🎉 This PR is included in version 1.1.2 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[jwaltz]

@mw10013 I am working on a Remix + Vite + Cloudflare Pages app and am running into issues with Buffer not being defined:

ReferenceError: Buffer is not defined at exports.encode from package thirty-two.

I have the nodejs_compat flag enabled with wrangler and when deployed to CF Pages, and call installGlobals() in vite.config.ts in hopes that one of these would polyfill/fix the issues but no luck.

@kentcdodds This package has worked perfectly in development for implementing my own SMS OTP authentication, hope I can get the Buffer issue sorted. Thank you for this!

[kentcdodds]

I'm not familiar with the limitations of that platform, but I welcome a PR to fix this if you find out what to do about it.

[mw10013]

@jwaltz

@mw10013 I am working on a Remix + Vite + Cloudflare Pages app and am running into issues with Buffer not being defined:

remix-auth-totp uses epicweb-dev/totp. You can also ping me on discord.

https://github.com/dev-xo/remix-auth-totp/blob/main/docs/customization.md#cloudflare

Vite
Enable Nodejs compatiblity for Cloudflare in wrangler.toml, Cloudflare Dashboard, and in the start script inside package.json.

"scripts": {
  "start": "wrangler pages dev ./build/client --compatibility-flags=nodejs_compat"
}

Ensure the Buffer global is set up before using remix-auth-totp.

import { Buffer } from 'node:buffer'

function setUpGlobals() {
  globalThis.Buffer = Buffer
}