Skip to content

TypeScript 6 compatibility: import '@payloadcms/next/css' fails with TS2882 #16346

@andershermansen

Description

@andershermansen

Describe the Bug

TypeScript 6 enables noUncheckedSideEffectImports by default (announcement). This causes all three import '@payloadcms/next/css' statements generated by create-payload-app to fail with TS2882.

Type error: Cannot find module or type declarations for side-effect import of '@payloadcms/next/css'.

Link to the code that reproduces this issue

https://github.com/andershermansen/payload-repro-ts6-css-import

Reproduction Steps

  1. Create a new payload app from blank template
  2. Update to typescript 6.0.3
  3. Build

Actual:
Build fails

Expected:
Build successful

Which area(s) are affected?

area: core

Environment Info

Binaries:
  Node: 24.15.0
  npm: 11.12.1
  Yarn: N/A
  pnpm: 10.33.0
Relevant Packages:
  payload: 3.83.0
  next: 16.2.3
  @payloadcms/db-mongodb: 3.83.0
  @payloadcms/graphql: 3.83.0
  @payloadcms/next/utilities: 3.83.0
  @payloadcms/richtext-lexical: 3.83.0
  @payloadcms/translations: 3.83.0
  @payloadcms/ui/shared: 3.83.0
  react: 19.2.4
  react-dom: 19.2.4
Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 25.4.0: Thu Mar 19 19:30:44 PDT 2026; root:xnu-12377.101.15~1/RELEASE_ARM64_T6000
  Available memory (MB): 32768
  Available CPU cores: 10

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions