I am trying to get bryntum working with Next.js. I tried some of the techniques used in the other forums but I ran into the problem that the app is never able compile the website. It just keeps loading.
Could you provide an example of the resource-utilization function in next.js?
If the following didn't work out for you, please provide a project sample with your configuration, with that we could assist you better to figure out what you need.
The React components are just wrappers, all the configurations are still the same as the plain JS library.
Yes I tried that and now it just keeps loading, it does not even give an error. This is probably because I am using both the resource histogram and Gantt at the same time.
I made the changes and it still just keeps loading. Is there anything else you changed to make it work? Maybe you could send me your code so I can test it?
Also I get this Warning: data for page "/_error" (path "/") is 2 MB which exceeds the threshold of 128 kB, this amount of data can reduce performance.
Hello Ömer, I've downloaded zip of your repo and tried to run it and I get errors in the console that do not seem Bryntum related:
npm run dev
> dev
> next dev
warn - Port 3000 is in use, trying 3001 instead.
ready - started server on 0.0.0.0:3001, url: https://localhost:3001
event - compiled client and server successfully in 743 ms (535 modules)
wait - compiling...
event - compiled client and server successfully in 111 ms (535 modules)
wait - compiling / (client and server)...
error - ./node_modules/react-date-range/dist/components/Calendar/index.js:28:0
Module not found: Can't resolve 'date-fns/max'
Import trace for requested module:
./node_modules/react-date-range/dist/index.js
./components/SideBar.jsx
./pages/index.js
https://nextjs.org/docs/messages/module-not-found
wait - compiling /_error (client and server)...
error - ./node_modules/react-date-range/dist/components/Calendar/index.js:28:0
Module not found: Can't resolve 'date-fns/max'
Import trace for requested module:
./node_modules/react-date-range/dist/index.js
./components/SideBar.jsx
./pages/index.js
https://nextjs.org/docs/messages/module-not-found
Neither date-fns nor anything inside SideBar.jsx refers to a Bryntum component. What am I doing wrong/different?
This is weird since I reinstalled everything and it still works. I have updated the git, maybe you can try that and if that does not work please try to install the date-fns module manually it seems to be related to one of the components I use.
I downloaded sources from your github repo today. I see these errors in console. (not browser console, but where I started npm)
mflix-main % npm run dev
dev
next dev
ready - started server on 0.0.0.0:3000, url: https://localhost:3000
event - compiled client and server successfully in 5.5s (535 modules)
wait - compiling...
event - compiled client and server successfully in 135 ms (535 modules)
wait - compiling / (client and server)...
error - ./node_modules/react-date-range/dist/components/Calendar/index.js:28:0
Module not found: Can't resolve 'date-fns/max'
Import trace for requested module:
./node_modules/react-date-range/dist/index.js
./components/SideBar.jsx
./pages/index.js
https://nextjs.org/docs/messages/module-not-found
wait - compiling /_error (client and server)...
error - ./node_modules/react-date-range/dist/components/Calendar/index.js:28:0
Module not found: Can't resolve 'date-fns/max'
Import trace for requested module:
./node_modules/react-date-range/dist/index.js
./components/SideBar.jsx
./pages/index.js
These errors don't seem to be related with our components. Could you please investigate it and check if you can simply remove all unrelated code/imports and check if it works well with our components only?