Hi. I've created a collection called PortfolioItems.ts in the collections folder and added it to the Payload config file. I've restarted the Payload server. It's not displaying in the Payload admin page? What am I doing wrong?
Repo:
https://github.com/taunhealy/PayloadHotel2
PortfolioItems collection is registered in the MongoDB database
It's not displaying in Payload admin panel
are the other types showing in the admin panel? @Taun
Pages, Media and User
are you running the correct project? right port and db creds? cause you dont have a
User
declared in this ^ config
Does this look right?
MONGO_URL=mongodb+srv://taunhealy:<password>@cluster0.zpesqyk.mongodb.net/?retryWrites=true&w=majority
With my password inserted
The cluster on Mongo contains the PortfolioItems
With no query items yet as I haven't submitted from Payload
When i nav to localhost:3000 it used to return 404 error message, now it returns errror:
"missing required error components, refreshing..."
Maybe that is related
Did you configure your localhosts for payload and next properly in the .env?
As per the instructions to copy the .env.example
I think I renamed the env.example to env.
Is this fine? NEXT_PUBLIC_SERVER_URL=
http://localhost:3000PAYLOAD_PUBLIC_SERVER_URL=
http://localhost:3000
.env *
PORT=3000 and my secret key is there
import { buildConfig } from 'payload/config';
import dotenv from 'dotenv';
import Page from './collections/Page';
import Media from './collections/Media';
import PortfolioItems from './collections/PortfolioItems';
dotenv.config();
export default buildConfig({
serverURL: process.env.PAYLOAD_PUBLIC_SERVER_URL,
collections: [
Page,
Media,
PortfolioItems,
],
});
put them on different ports
like next on 3001 and try again
as well as PORT:3001?
Putting those 3 on 3001 returned no errors wihtin VScode, though browser returned "This site can’t be reachedlocalhost refused to connect."
oh actually i just read the original docs better, whats your output from
yarn dev
?
npm run dev
> payload-nextjs-server@0.0.1 dev
> ts-node server.ts
[10:30:56] INFO (payload): Connected to Mongo server successfully!
[10:30:56] INFO (payload): Starting Payload...
info - Loaded env from C:\git\2160\PayloadHotel1\.env
webpack built a9cb4e3b94061ca113e9 in 10522ms
WARNING in ./node_modules/slate-react/dist/index.es.js 457:70-88
export 'Scrubber' (imported as 'Scrubber') was not found in 'slate' (possible exports: Editor, Element, Location, Node, Operation, Path, PathRef, Point, PointRef, Range, RangeRef, Span, Text, Transforms, createEditor)
WARNING in ./node_modules/slate-react/dist/index.es.js 602:75-93
export 'Scrubber' (imported as 'Scrubber') was not found in 'slate' (possible exports: Editor, Element, Location, Node, Operation, Path, PathRef, Point, PointRef, Range, RangeRef, Span, Text, Transforms, createEditor)
WARNING in ./node_modules/slate-react/dist/index.es.js 674:77-95
export 'Scrubber' (imported as 'Scrubber') was not found in 'slate' (possible exports: Editor, Element, Location, Node, Operation, Path, PathRef, Point, PointRef, Range, RangeRef, Span, Text, Transforms, createEditor)
WARNING in ./node_modules/slate-react/dist/index.es.js 4662:95-113
export 'Scrubber' (imported as 'Scrubber') was not found in 'slate' (possible exports: Editor, Element, Location, Node, Operation, Path, PathRef, Point, PointRef, Range, RangeRef, Span, Text, Transforms, createEditor)
WARNING in ./node_modules/slate-react/dist/index.es.js 4666:71-89
export 'Scrubber' (imported as 'Scrubber') was not found in 'slate' (possible exports: Editor, Element, Location, Node, Operation, Path, PathRef, Point, PointRef, Range, RangeRef, Span, Text, Transforms, createEditor)
webpack compiled with 5 warnings
<w> [webpack.cache.PackFileCacheStrategy] Caching failed for pack: Error: No serializer registered for ConcatSource
<w> while serializing webpack/lib/util/registerExternalSerializer.webpack-sources/ConcatSource -> Array { 2 items } -> ConcatSource
I used npm
i would actually recommend yarn, there are subtle differences in peer dependency resolutions where npm struggles
that said run a
yarn install
again see if it changes this output, although none of it is an error
PS C:\git\2160\PayloadHotel1> yarn install
yarn install v1.22.19
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
( some warnings were here)
error An unexpected error occurred: "EPERM: operation not permitted, copyfile 'C:\\Users\\taunh\\AppData\\Local\\Yarn\\Cache\\v6\\npm-ansi-regex-5.0.1-integrity\\node_modules\\ansi-regex\\package.json' -> 'C:\\git\\2160\\PayloadHotel1\\node_modules\\ansi-regex\\package.json'".
info If you think this is a bug, please open a bug report with the information provided in "C:\\git\\2160\\PayloadHotel1\\yarn-error.log".
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
PS C:\git\2160\PayloadHotel1>
Also might be worth trying to make a GET request to
/api/access
to see if the collection shows up there
https://payloadcms.com/docs/authentication/operations
Thanks, I'll try that
3001 isn't working
nah reverse the port to the initial, cause i think the setup in this case is meant to be a little different with the monorepo
though I never tried running payload in a monorepo myself so idk of the caveats yet
It's back to returning this error. Strange because the first time i tried Payload it worked locally. I don't remember change those server URLs. What should they be?
I'm going to start a fresh project
I recommend you try a separate approach tbh, it'll make hosting easier for you as well
Sorta ^ complex templates but maybe it'll help you structure your codebase better from the start
Thanks, are these for Nextjs?
Is this the right repo for a Nextjs project or is it adding server complexity?
https://github.com/payloadcms/nextjs-custom-server
After setting up a new project it's not displaying the PortfolioItems collection.
I've gettting this error in the terminal:
PS C:\git\2160\PayloadHotel2> yarn dev
yarn run v1.22.19
$ ts-node server.ts
[11:09:00] INFO (payload): Connected to Mongo server successfully!
[11:09:00] INFO (payload): Starting Payload...
info - Loaded env from C:\git\2160\PayloadHotel2\.env
event - compiled client and server successfully in 3.3s (160 modules)
uncaughtException [Error: EPERM: operation not permitted, open 'C:\git\2160\PayloadHotel2\.next\trace'] {
errno: -4048,
code: 'EPERM',
syscall: 'open',
path: 'C:\\git\\2160\\PayloadHotel2\\.next\\trace'
}
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
This one is for running nextjs and payload on the same express server, which I think is a pretty
nichesetup
I'd do them separately and just communicate between them via the APIs
Ok cool, so I can use this repo?
https://github.com/payloadcms/website-cmsYeah even if just for an example, but it's quite fully featured and has a strict adherence to good coding standards
following the default getting started steps is also a good option
https://payloadcms.com/docs/getting-started/installation
you can choose a starter like todo or blog
but it will be more bare than the example above ^
Thanks for the help. Later today I'll create a Next app and then install Payload via
npm install --save --legacy-peer-deps payload
yarn*
I haven't resolved the issue yet. I'm curious as to what the problem is if anyone has experienced it?
Resolved now - I created a fresh project, it returned some strange error missing Next trace or something, I restarted vscode and the server and it's working fine.
Star
Discord
online
Get help straight from the Payload team with an Enterprise License.