[REACT] Grid loads fine, but series of 404s for Bryntum resources

[richard.marquez]

When using the BryntumGrid component from schedulerpro-react, the component works fine, but there is a long series of 404s for Bryntum resources. Example of 404s below, usage of BryntumGrid attached.

GET /next/static/src/BryntumColorField.tsx 404 in 10766ms
GET /next/static/src/BryntumCombo.tsx 404 in 10907ms
GET /next/static/src/BryntumConstraintTypePicker.tsx 404 in 10170ms
GET /next/static/src/BryntumContainer.tsx 404 in 9615ms
GET /next/static/src/BryntumDateField.tsx 404 in 10247ms
GET /next/static/src/BryntumDatePicker.tsx 404 in 9670ms
GET /next/static/src/BryntumDateRangeField.tsx 404 in 8894ms
GET /next/static/src/BryntumDateTimeField.tsx 404 in 9394ms
GET /next/static/src/BryntumDemoCodeEditor.tsx 404 in 9726ms
GET /next/static/src/BryntumDependencyTypePicker.tsx 404 in 10021ms
GET /_next/static/src/BryntumDisplayField.tsx 404 in 9222ms

[marcio]

Hey richard.marquez,

Thanks for reaching out, and welcome to our forums!

We have a section on our docs regarding NextJS integration, please see it here https://bryntum.com/products/grid/docs/guide/Grid/integration/react/guide#loading-components-dynamically-with-next-js.

If you want a more detailed guide, we have that on Gantt (different product, but the dynamic is the same) https://www.bryntum.com/products/gantt/docs/guide/Gantt/quick-start/nextjs and a start project https://github.com/bryntum/bryntum-gantt-nextjs-quick-start.

[richard.marquez]

As noted in the docs, I have a wrapper around the BryntumGrid and I am dynamically loading that wrapper component with SSR turned off as shown in the below code. Not sure what step I am missing here that would lead to a working grid, but 404s.

const UnscheduledAppointmentsGrid = dynamic(
    () => import('@/app/scheduler/components/UnscheduledAppointmentsGrid'),
    { ssr: false },
);

Am I missing a package or an import? Here is the relevant portion of my package.json:

    "dependencies": {
	...
        "@bryntum/demo-resources": "^1.3.0",
        "@bryntum/schedulerpro": "npm:@bryntum/schedulerpro-trial@6.2.0",
        "@bryntum/schedulerpro-react": "6.2.0",
        ...

[khattakdev]

What's your NextJS version?

Could you please share a reproducible test case so we can debug and figure out what's wrong.

[richard.marquez]

Needed to add a postbuild script to package.json to manally copy those src files into .next/. Problem is resolved now.

"postbuild": "cpx \"node_modules/@bryntum/schedulerpro-react/src/**/*\" .next/static/src"