Currently, we globally enable both DOM and Node.js types. While this mostly works, it can cause conflicts - particularly with `fetch`. For example, TypeScript may incorrectly allow browser-only properties (like `cache`) and reject valid Node.js ones like `dispatcher`. This PR disables DOM types for server-only packages like payload, ensuring Node-specific typings are applied. This caught a few instances of incorrect fetch usage that were previously masked by overlapping DOM types. This is not a perfect solution - packages that contain both server and client code (like richtext-lexical or next) will still suffer from this issue. However, it's an improvement in cases where we can cleanly separate server and client types, like for the `payload` package which is server-only. ## Use-case This change enables https://github.com/payloadcms/payload/pull/12622 to explore using node-native fetch + `dispatcher`, instead of `node-fetch` + `agent`. Currently, it will incorrectly report that `dispatcher` is not a valid property for node-native fetch
S3 Storage for Payload
This package provides a simple way to use S3 with Payload.
NOTE: This package removes the need to use @payloadcms/plugin-cloud-storage as was needed in Payload 2.x.
Installation
pnpm add @payloadcms/storage-s3
Usage
- Configure the
collectionsobject to specify which collections should use the AWS S3 adapter. The slug must match one of your existing collection slugs. - The
configobject can be anyS3ClientConfigobject (from@aws-sdk/client-s3). This is highly dependent on your AWS setup. Check the AWS documentation for more information. - When enabled, this package will automatically set
disableLocalStoragetotruefor each collection. - When deploying to Vercel, server uploads are limited with 4.5MB. Set
clientUploadstotrueto do uploads directly on the client. You must allow CORS PUT method for the bucket to your website. - Configure
signedDownloads(either globally of per-collection incollections) to use presigned URLs for files downloading. This can improve performance for large files (like videos) while still respecting your access control. Additionally, withsignedDownloads.shouldUseSignedURLyou can specify a condition whether Payload should use a presigned URL, if you want to use this feature only for specific files.
import { s3Storage } from '@payloadcms/storage-s3'
import { Media } from './collections/Media'
import { MediaWithPrefix } from './collections/MediaWithPrefix'
export default buildConfig({
collections: [Media, MediaWithPrefix],
plugins: [
s3Storage({
collections: {
media: true,
'media-with-prefix': {
prefix,
},
'media-with-presigned-downloads': {
// Filter only mp4 files
signedDownloads: {
shouldUseSignedURL: ({ collection, filename, req }) => {
return filename.endsWith('.mp4')
},
},
},
},
bucket: process.env.S3_BUCKET,
config: {
credentials: {
accessKeyId: process.env.S3_ACCESS_KEY_ID,
secretAccessKey: process.env.S3_SECRET_ACCESS_KEY,
},
region: process.env.S3_REGION,
// ... Other S3 configuration
},
}),
],
})
Configuration Options
See the the AWS SDK Package and S3ClientConfig object for guidance on AWS S3 configuration.