Hi,
I've created a scaffold project by running
npx create-payload-app
and just added a simple
paths
entry to my Typescript configuration named
@collections
(see attached screenshot #1).
Then, just to test things out, I replaced
import Users from './collections/Users';
with
import Users from '@collections/Users';
in
payload.config.ts
(screenshot #2) and run
yarn dev
to start the server: now I get the error "Cannot find module '@collections/Users'".
What could be the problem?
Hi @GiS91 - you just need to add
./
in front of
src/collections/*
then you should be good to go
Ehi @jesschow , thank you so much for your reply!
That's what happen when you try to write code at midnight 🤣
Anyway, the solution you propose does not seem to fix the issue. I investigated the thing a bit further and it seems that the problem relates both to
ts-nodeand
webpack.
According to ts-node documentation [1], ts-node does not support
paths
resolution out of the box, so the first thing to do is to install
tsconfig-paths
and add it to the ts-node config as explained in the documentation.
After that, you have to extend your webpack alias configuration in your
payload.config.ts
as in the attached screenshot.
Completed the above two steps, the dev server starts normally
[1]
https://typestrong.org/ts-node/docs/paths/@GiS91 Yep! That worked for ya right?
@Jarrod Yesss... with those two steps it works perfectly!
@jesschow @Jarrod Thank you for your support! ❤️
I followed you instructions but now my relative paths in my imports don't work! Any ideas?
Weird, actually this is working for me now, issue I ran in to was trying to also use the webpack plugin with this setup which I could not get to work (
https://www.npmjs.com/package/tsconfig-paths-webpack-plugin)
Star
Discord
online
Get help straight from the Payload team with an Enterprise License.