Spread Designer is not working in Next.js

Spread Designer is not working in Next.js

Posted by: tyler on 13 August 2024, 3:41 pm EST

• 

  tyler

  • Post Options:
  • Link
    Copy

  Posted 13 August 2024, 3:41 pm EST

  Pulling in Designer and trying to return it results in various errors in my project, as well as a stand alone, fresh install of Next.js 14

  In all cases, the errors seem to relate to charts and shapes, but they aren’t consistent in my environments. For simplicity sake, I’m sticking with the fresh Next 14 install.

  There is no specific Next documentation for Designer, just React. But following this, I am getting:

  TypeError: Cannot read properties of undefined (reading ‘FormControlType’)

  Also this callstack:

  ./src/commands/shapeHelper.ts
  
  node_modules/@mescius/spread-sheets-designer/dist/gc.spread.sheets.designer.all.min.js (1:4829727)
  
  i
  
  node_modules/@mescius/spread-sheets-designer/dist/gc.spread.sheets.designer.all.min.js (1:8942817)
  
  ./src/commands/chartHelper.ts
  
  node_modules/@mescius/spread-sheets-designer/dist/gc.spread.sheets.designer.all.min.js (1:301516)
  
  i
  
  node_modules/@mescius/spread-sheets-designer/dist/gc.spread.sheets.designer.all.min.js (1:8942817)
  
  ./src/components/compositeComponents/rangeSelect/rangeSelectDialog.ts
  
  node_modules/@mescius/spread-sheets-designer/dist/gc.spread.sheets.designer.all.min.js (1:7477912)
  
  i
  
  node_modules/@mescius/spread-sheets-designer/dist/gc.spread.sheets.designer.all.min.js (1:8942817)
  
  ./src/components/compositeComponents/dialog/templateBindDialog.ts
  
  node_modules/@mescius/spread-sheets-designer/dist/gc.spread.sheets.designer.all.min.js (1:7274869)

• 

  priyam.kushwaha

  

  • Post Options:
  • Link
    Copy

  Posted 14 August 2024, 5:33 am EST - Updated 14 August 2024, 5:38 am EST

  Hi,

  I tried to replicate the behavior on my end but failed to do so. On my end, Designer version 17.1.3 is working as expected with nextjs 14 without any issue. Refer to the attached gif “Steps.gif” and sample.

  Gif:

  Sample: Sample.zip

  Refer this link to know more how to use nextjs with SpreadJS: https://developer.mescius.com/spreadjs/docs/javascript-frameworks/spreadjs-with-nextjs . Simialry, you can use the nextjs with designer.

  To better assist you, could you share a sample along with the steps to replicate the behavior you have observed, or modify the existing sample to replicate the behavior? This will enable me to investigate the problem more thoroughly. additionally, It would be helpful if you could provide a GIF or video illustrating the issue.

  Regards,
  
  Priyam