Created by
vinjin 60 about 22 days ago

Compiling legacy components in Next.js (Can't resolve 'react/jsx-dev-runtime', Global CSS cannot be imported)

I've just spun up a new Next.js project (React v 17.0.1). I am attempting to compile and import components from a legacy project. Seeing a few errors getting things to work:

  1. Module not found: Can't resolve 'react/jsx-dev-runtime'. I have a hunch this may have something to do with the new JSX compiler in React 17.

    • This can be resolved by adding /** @jsxRuntime classic */ to the top of the file, but i'd prefer to just turn on the classic compiler. Is this possible?
  2. Global CSS cannot be imported from files other than your Custom <App>

    • This can be resolved by using modules, or importing in pages/_app. However, i'd like to turn this safety feature off, leaving the legacy components as is.


  1. How can I force Next.js to use the classic JSX compiler instead of the new automatic one
  2. How do I turn off the safety "feature" forcing CSS to only be imported to _app?

See task infos

Solutions (1)


rowanskye 371 about 21 days ago
10.66 mBCH
Accepted solution