derosullast year
Yes! you can use both at the same time!

I tried to move the Payload admin to the pages component as well, but I quickly changed my mind when I found out that my styles etc are getting included in my _app.tsx, this interfered with Payload styles. So wouldn't recommend that 😓

But the Payload admin route can live in perfect harmony with your current Pages setup 🙂
martafiixeklast year
Oh ok, I found the exact same issue
derosullast year
haha, my tailwind css made Payload look pretty weird on dark mode and weird stuff like that.
martafiixeklast year
And do you have any experience running it on Vercel?
derosullast year
Yes and No, previously I managed to get it running with ease on Vercel.

However, I picked up next-payload a couple of days ago for a side project, but i get an scss error when trying to build the application

https://github.com/payloadcms/next-payload/issues/38

Update on that one, managed to fix that issue, it was involved when using a plugin that introduces a custom component. If you're encountering the same problem add this to your next-config.js
```
    transpilePackages: [
        'your-payload-plugin-package'
    ],
```
paulpopuslast year
I'm also running a App router and Pages hybrid, wasnt painless at the start but its usable now, though who knows what happens in week with this platform 😂
notchrlast year
I see a lot of next-related issues, why is this?

Every other post I see, not just on Payload discord is some issue with Next breaking etc
paulpopuslast year
App router + react server components in one big breaking change update brings a lot of issues as its expected...a ton of libs dont work the same, there's no way to tell what works and what doesnt except to try it out if the maintainter doesnt explicitly say anything

quite a few changes in paradigm as well so it's just more confusing for everyone as well as poor documentation on how the advanced components/config in next should/can behave

maybe with hindsight we'll see this as growing pains or maybe a red flag going forward 🤷
martafiixeklast year
What is the deal with this issue though?

https://github.com/payloadcms/next-payload/issues/24
As I'm getting the same behavior with npm

Of course on a new created Next app, it works fine

Not in my current project though

Yarn works fine though

Nevermind, it works with
npm
too, seems like package-lock was somehow "corrupted"

Nevermind, found the main issue

Installing
mongodb
in the core project fucks up Payload
mongo
(actually
mongoose
ig) dependecies and its dependencies
notchrlast year
@217360281309806593
Ah so the issue was the difference between mongodb and mongoose libraries?
martafiixeklast year
From my point of view, it happened, when I had MongoDB installed as a direct dependency in my project. Didn't matter whether using
npm
or
yarn
. The solution is to either:

- Don't install MongoDB as a direct dependency of your project, instead you can import
mongo
from
node_modules
, as Payload installed
mongoose
which installs
mongo
, so
mongo
is still present inside
node_modules
- Don't use MongoDB. Instead I got rid of Mongo as a direct dependency and query database with Payload Local API

- Fix it using some type of
npm / yarn
resolves
notchrlast year
Interesting, I'm doing my best to follow, but I think I get the idea. Was Payload the one installing mongodb as a direct dependency?

Maybe
@858693520012476436
can provide some insight here
martafiixeklast year
No, someone before me installed
mongo
to the project as a direct dependency, I'm trying to refactor it and migrate to Payload

Then I installed
payload
and
next-payload
notchrlast year
Ahhhhh okay that makes more sense then
martafiixeklast year
I need to now rewrite some functions that used
mongo
directly
notchrlast year
I'm surprised there are direct mongo calls being made tbh
martafiixeklast year
I mean it is a crappy code, so haha
notchrlast year
Ahhh
martafiixeklast year
Variables are named
aaa

any
everywhere
notchrlast year
I'm not sure using direct mongo calls will be good

I understand your position

But it could definitely break things
martafiixeklast year
Well, that's why I'm rewriting it 😄
notchrlast year
😄
martafiixeklast year
No, it still didn't break anything
notchrlast year
Haha okay that's good then

Well, at least now it didn't

In any case, it's good you're cleaning it up

Hopefuly it's not too crazy of a rewrite
martafiixeklast year
No, its actually fine

Just the database part will be a bit of a hassle

1,5 million documents, 26 GB
notchrlast year
Yikes, well, you're testing with a sample of that data set right?

like 100 docs
martafiixeklast year
Exactly 100, are you a mind reader?
notchrlast year
shh

No one is supposed to know

looks around cautiously
martafiixeklast year
notchrlast year
hehe

Let us know if you run into any other issues!

Good luck 😄
martafiixeklast year
Thanks!

This is starting to become really annoying. It happens when installing anything that
mongoose
uses, now it happens with
bson
package

And I have really no idea why
notchrlast year
@217360281309806593
what's the error that occurs?
martafiixeklast year
@1049775120559898725
Same as
https://github.com/payloadcms/next-payload/issues/24
notchrlast year
Hmm

And this stemmed from not having a fresh repo right?
martafiixeklast year
It happens even with a clean repo and just installing MongoDB

So I fixed it

There are two ways:

- Install MongoDB and lock it to one version that Mongoose (required by Payload) uses (for example I had to specify "mongodb": "4.8.1")

- Additionally install packages that are really needed and ignore the ones you dont need with some Webpack config (
https://github.com/Automattic/mongoose/issues/13212#issuecomment-1518012851
)

Open

Continue the discussion in Discord

Star on GitHub

Star

Chat on Discord

Discord

online

Can't find what you're looking for?

Get dedicated engineering support directly from the Payload team.