I'd like to be able to import my files via a @ prefix, so I don't have to ../../../ all my imports. Luckily, Webpack has a solution for this.
However, I'm pretty sure that the issue is just my own misundertanding of my coding environment.
import Test from "./collections/test"
export default buildConfig({
admin: {
user: AdminUsers.slug,
bundler: webpackBundler(),
webpack: (config) => {
return {
...config,
resolve: {
...config.resolve,
alias: {
...config.resolve.alias,
"@": path.resolve(__dirname, "/"),
},
}
}
},
},
...The path is correct (checked it by console logging it)
import addAuthenticatedUserID from "@/hooks/access/create/add-authenticated-user-id"
const Test: CollectionConfig = {
access: {
create: addAuthenticatedUserID
},
...100% sure that the path is correct (it is autocompleted by my IDE)
----
When I console logged the Webpack alias I had to remove the imported
collection/test.ts. This made me realise that the problem is in my
ts-nodeserver initialisation when I run
yarn dev([nodemon] starting ts-node src/server.ts -- -I).
----
While writing this down I asked ChatGPT once more for input, who came with a solution for this situation;
I had to install
tsconfig-pathsand modify my
nodemon.jsso that it will use tsconfig-paths in the exec function
"exec": "ts-node -r tsconfig-paths/register src/server.ts -- -I",I just wanted to share this over here, just in case anyone else runs into it
hello
@703162911241273394🙂 I've sent you a dm! 🙂
Solution was to add a
.before the
/(
"@": path.resolve(__dirname, "./"),) (instead of "@": path.resolve(__dirname, "/"),
Just adding this here for future reference 🙂
Followed your solution
@703162911241273394but still stuck
webpack: (config) => {
config.resolve.alias = {
...config.resolve.alias,
"@": path.resolve(__dirname, "./"),
};
return config;
},Do I need to install
tsconfig-paths?
Star
Discord
online
Get dedicated engineering support directly from the Payload team.