Using NextJS and @emotion

I'm having some issues trying to integrate NextJS and @emotion.

With a fresh NextJS app and some basic @emotion substitutions added, if I run yarn build; yarn start I get a serviceable, albeit dull-looking app, but the styles are rendering correctly.

If on the other hand I run yarn dev I get an un-styled piece of text, and a NextJS error box:

 1 of 1 unhandled error

Unhandled Runtime Error
Error: Cannot find module '@emotion/react'

Call Stack
webpackMissingModule
webpack-internal:///./node_modules/@emotion/styled/dist/emotion-styled.browser.esm.js (7:50)
...

Here's my basic package.json:

{
  "name": "formsapp",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@babel/core": "^7.17.8",
    "@emotion/core": "^11.0.0",
    "@emotion/react": "^11.8.2",
    "@emotion/styled": "^11.8.1",
    "next": "12.1.4",
    "react": "^18.0.0",
    "react-dom": "18.0.0"
  },
  "devDependencies": {
    "@types/node": "17.0.23",
    "@types/react": "17.0.43",
    "@types/react-dom": "17.0.14",
    "eslint": "8.12.0",
    "eslint-config-next": "12.1.4",
    "typescript": "4.6.3"
  }
}

I've tried a dumping the entire node_modules directory and doing a fresh install, with and without a yarn cache clean, and still no joy.

My assumption is that the built code is still seeing the error, but just not showing it? But if that's the case, why are the styles working in the built version?