search

DHTMLX / gantt

GPL version of Javascript Gantt Chart
https://dhtmlx.com/docs/products/dhtmlxGantt/
GNU General Public License v2.0
1.44k stars 320 forks source link

Nextjs #97

Open murrayleysrgu opened 1 year ago

murrayleysrgu commented 1 year ago

Is it possible to use this with Next.js?

I tried to follow the react example but got the following error

error Error [ReferenceError]: window is not defined at Object. (/Users/ml/Development/Sites/ga-scheduler/node_modules/dhtmlx-gantt/codebase/dhtmlxgantt.js:13:218)

is there a working example with the latest version of Next?

gearcoded commented 1 year ago

@murrayleysrgu, by default, Next.js runs the code with the server-side rendering. You cannot run Gantt that way as it is a client-side application and requires the Window object and DOM. You will need to add the following line to the page with the Gantt configuration:

"use client";

https://nextjs.org/docs/getting-started/react-essentials#the-use-client-directive

Here are the demos: https://files.dhtmlx.com/30d/5c0514c86ca9898058d2fc64bdfc8259/nextjs+GanttInstance-alternative.zip https://files.dhtmlx.com/30d/27c23572db2101a749a3168d1e8b7917/nextjs+GanttInstance.zip