sanity-typed: Breaks in pnpm environment

Hi!

Thanks for making this package! It’s fantastic 😃 I’m using pnpm as my package manager and I have been getting errors after building Sanity studio. To reproduce:

pnpm create sanity@latest

# project: test
# dataset: test
# output: test
# template: no schemas
# typescript: yes

cd test
pnpm install @sanity-typed/types
// sanity.config.ts
import {defineConfig} from '@sanity-typed/types' // <-- change this line to import from sanity-typed
// ...
pnpm run build
pnpm run start

The error I’m getting:

Uncaught error: Pe.default.div is not a function
http://localhost:3333/static/sanity-9dde895e.js:4670:40453
TypeError: Pe.default.div is not a function
    at http://localhost:3333/static/sanity-9dde895e.js:4670:40453
    at http://localhost:3333/static/sanity-9dde895e.js:7423:54634

This error resolves when I change this line back:

// sanity.config.ts
import {defineConfig} from 'sanity' // <-- change this line to import from sanity
// ...

I wasn’t able to create a StackBlitz or something similar doing these steps, so I’m not sure how this reproduces on other machines. I’m using a Macbook Pro with Ventura 13.4

About this issue

  • Original URL
  • State: open
  • Created 9 months ago
  • Reactions: 1
  • Comments: 17 (10 by maintainers)

Most upvoted comments

https://github.com/waspeer/sanity-typed-issue

This repo includes step 1-4 in my comment. Let me know if this works for you.

Yeah its a tricky issue. I did not have the time to dig into it yet, but my suspicion is that it has something to do with the portabletext editor dependency, since that is the only one in this package that depends on styled components. I hope to be able to look into this later, but if you find out something I’m curious to hear your findings.

Got snagged by this as well 😢. It’d be nice to add a warning to the readme page saying it’ll break if you use pnpm. Sanity offers pnpm as a supported option when you spin up a new project so it’s likely that more people are going to stumble here. It’s also tricky to figure out what’s going on since it works in dev mode but breaks in prod mode. 🤦

So I’ve never used pnpm and I wasn’t really planning on supporting it, although it’s nice to identify this issue twice as a pnpm specific issue. I have no idea what’s happening. My immediate guess is that the default.div error has something to do with styled-components, which I think that sanity uses and, since sanity is a peer dependency, the issue has something to do with how pnpm handles or doesn’t handle peer dependencies. Maybe you can help solve this.

Even if I were to support this, I’m not sure how to maintain it. It seems difficult to get CI to setup a repo with each package as a dependency, attempt npm/yarn/pnpm install, build, and determine that running also works (because in this case, it’s actually running the studio that identifies the issue). Without this full pipeline, the chances that I re-break pnpm without knowing it are extremely high.