is it important to keep the family-chart.css file in the same directory as .js file, because it creates the below error while using with nextjs.

Question

is it important to keep the family-chart.css file in the same directory as .js file, because it creates the below error while using with nextjs.

Opened this issue 2 years ago · 5 comments

Answer 1 · 2022-12-22T06:28:42.000Z

Since in nextjs we can only create a single globals.css file and put all the style there only, hence putting the code of family-chart.css in there and using it after that causes the error as

This is the comment you have attached with the import css file.

because importing it locally as raw .css file hinders it's use in other libraries of react like nextjs, hope you got the issue

Answer 2 · 2022-12-22T06:29:43.000Z

please check at line 3 in the second pic above

Answer 3 · 2023-01-02T21:31:26.000Z

Issue seems to be that nextjs is trying to render component on server side.
Try to make sure that it is rendered when page is loaded on client side only.
Css import should not be a problem, you can put css code in global.css as well.

Answer 4 · 2023-01-10T11:02:45.000Z

Okay, I will try, if you can reference me the replica of that client-side-rendering? Please let me know the steps through which I can do that.

Answer 5 · 2024-03-20T11:35:25.000Z

@kumar-abhinit Adding fake delay like promise fixed that problem for me in Nextjs 14
const delay = (ms: number) => new Promise((res) => setTimeout(res, ms)); call this in useEffect before the familytree renders