Issues upgrading to v1.6.11 and getting this error? any idea what might be the issue?

default discord avatar
liorix
7 months ago
36

/Users/liorix/Development/featurefm-rebranded-website/apps/cms-backend/src/payload.config.ts:1


import { buildConfig } from 'payload/config';


^^^^^^


Followed the following guide:

https://github.com/payloadcms/payload/blob/master/CHANGELOG.md#-breaking-changes

SyntaxError: Cannot use import statement outside a module


at Object.compileFunction (node:vm:360:18)


at wrapSafe (node:internal/modules/cjs/loader:1084:15)


at Module._compile (node:internal/modules/cjs/loader:1119:27)


at Object.Module._extensions..js (node:internal/modules/cjs/loader:1209:10)


at Module.load (node:internal/modules/cjs/loader:1033:32)


at Function.Module._load (node:internal/modules/cjs/loader:868:12)


at Function.Module._load (/Users/liorix/Development/featurefm-rebranded-website/packages/js/src/executors/node/node-with-require-overrides.ts:16:27)


at Module.require (node:internal/modules/cjs/loader:1057:19)


at require (node:internal/modules/cjs/helpers:103:18)


at loadConfig (/Users/liorix/Development/featurefm-rebranded-website/node_modules/payload/src/config/load.ts:22:25)


No errors found.

  • default discord avatar
    TacticalSmoores
    7 months ago

    I have the same problem. I am currently using 1.5.9 because of it.


    https://github.com/payloadcms/nextjs-custom-server/issues/26
  • default discord avatar
    eloahsam
    7 months ago

    I had the the same problem days ago when I moved from 1.5.9 to 1.6.9 …I just created a new payload project and moved my collections and config ..I wonder why this happens

  • discord user avatar
    jmikrut
    Payload Team
    7 months ago

    So this is because in 1.6.0, we have recently

    removed our automatic config transpilation

    - see the changelog w/ breaking change notes here:



    https://github.com/payloadcms/payload/blob/master/CHANGELOG.md#-payload-now-no-longer-transpiles-your-config-for-you
  • default discord avatar
    liorix
    7 months ago

    @jmikrut I did follow the migration guide and probably missed something, Could you please point me to the specific migration I should do to fix this issue?



    we do use typescript in this project

  • default discord avatar
    TacticalSmoores
    7 months ago

    Same issue here. I tried to follow the migration guide, but I must be missing something.



    Even the official

    nextjs-custom-server

    example fails

    yarn build

    because of this error.

  • discord user avatar
    denolfe
    Payload Team
    7 months ago

    Basically, you should be using the compiled version of your config

    payload.config.js

    resulting from your build. Previously, you could use a *.ts config in production because Payload would transpile automatically.



    What command are you running to get the error? What PAYLOAD_CONFIG_PATH?

  • discord user avatar
    jmikrut
    Payload Team
    7 months ago

    yep - there are lots of ways to handle transpilation for any given Node app that has TS / JSX, but basically, we suggest to use

    ts-node

    to transpile your app



    and if you do that, then

    import

    will no longer throw errors in development



    but in production, you will probably want to just run

    node

    instead of

    ts-node

    , so you should have already built your project into a

    /dist

    or similar



    and then in production, you'd run your app like this

    PAYLOAD_CONFIG_PATH=dist/payload.config.js NODE_ENV=production node dist/server.js


    and then any files that are used by

    dist/server.js

    should have already been converted to CommonJS (meaning no more

    import

    statements to be found)



    the best way to see this all working from top to bottom is to just start up a new

    npx create-payload-app

    and look at the NPM scripts that we ship you

  • default discord avatar
    TacticalSmoores
    7 months ago
    create-payload-app

    is very different from the

    nextjs-custom-server

    setup that was on the YouTube tutorial

  • discord user avatar
    jmikrut
    Payload Team
    7 months ago

    ahh yes, for that one, we will be updating that package shortly with a way to make that work



    which part are you having an error with? we can expedite this

  • default discord avatar
    TacticalSmoores
    7 months ago

    Sorry, @liorix I don't mean to hijack your thread.



    Me personally, I don't understand what exact steps are needed to "use the compiled version of your config payload.config.js instead of *.ts config." as you guys put it.



    It sounds like something needs to change in the

    package.json

    build script, and in the

    tsconfig.json

    and

    tsconfig.server.json

    .



    I don't need a full on tutorial, I really just need a commit history so that I can see what is being changed in your

    nextjs-custom-server

    repo and better understand why.

  • discord user avatar
    jmikrut
    Payload Team
    7 months ago

    well, nothing changed in our repo, nothing is necessary to change if you have always been using ts



    it's only for projects that used to be JS-only

  • default discord avatar
    TacticalSmoores
    7 months ago

    Well I don't understand because the

    nextjs-custom-server

    is typed, yet it can't be built.

  • discord user avatar
    jmikrut
    Payload Team
    7 months ago

    where is it failing for you? which command?

  • discord user avatar
    jmikrut
    Payload Team
    7 months ago

    ok i just followed up with a bit more detail and a plan for fixing this

  • default discord avatar
    TacticalSmoores
    7 months ago

    Saw your response, really appreciate it!

  • discord user avatar
    jmikrut
    Payload Team
    7 months ago

    sorry for the hassle. this will be taken care of for you shortly

  • default discord avatar
    liorix
    7 months ago

    I eventually scaffolded a new version of payload and copied my collections/etc to the new project and it worked



    thanks everyone

  • default discord avatar
    eloahsam
    7 months ago

    yeah that was quick solution aswell😂 sometimes the hardest way is the easiest

  • default discord avatar
    seth
    6 months ago

    I just spun up a brand new install and I'm still seeing this issue with js



    Ah ok I missed this particular line "There are many ways to mitigate this - but the best way is to just quickly scaffold a barebones TS implementation." - So seems that the

    javascript

    option in

    create-payload-app

    is effectively deprecated?



    Hmm still not quite success here, I am able to run the development server but I'm getting a ton of ts errors when I try to build, I've never used TypeScript so I'm admittedly very ignorant to the setup there, but is it possible to build a js payload project with the ts config there some other change to the package.json or similar?



    It's the

    build:server

    step that is failing. If I leave that out things seem to work, but not sure it's kosher to leave that out. My hunch is there's something about importing my js collections into the ts file that's causing issues?



    I'm getting TS2322 on every imported collection



    Peppering my

    payload.config.ts

    with a ton of

    @ts-ignore

    comments seems to solve this



    But I'm wondering if there's a path for people who won't ever be using ts to not have to do this workaround?

Open the post
Continue the discussion in Discord
Like what we're doing?
Star us on GitHub!

Star

Connect with the Payload Community on Discord

Discord

online

Can't find what you're looking for?

Get help straight from the Payload team with an Enterprise License.