Like what we’re doing? Star us on GitHub!

Custom Field Components Not Working

last month


I have been though the blog post here:

and am trying to add the color-picker custom field to a collection. When I do I receive:


return (<div className={baseClass}>


SyntaxError: Unexpected token '<'

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

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

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

at Module.m._compile (/customer-site/node_modules/ts-node/src/index.ts:1056:23)

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

at Object.require.extensions.<computed> [as .tsx] (/customer-site/node_modules/ts-node/src/index.ts:1059:12)

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

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

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

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

[nodemon] app crashed - waiting for file changes before starting...

I don't know where to start with this one...

Thanks in advance!

Found it in tsconfig.json "compilerOptions" - > "jsx": "react" not "preserve"

    Open the post
    Continue the discussion in Discord
    Can't find what you're looking for?
    Get help straight from the Payload team with an Enterprise License.Learn More