xr0master/chartjs-react

NextJS Errors

Closed this issue · 3 comments

Using this in a NextJS application creates errors when 1 refreshing the page after load and 2 trying to build the NextJS app. It is important to note that I am not rendering this server side, it is client side only and that I am using NextJS typescript.

import React, { useEffect, useRef, useCallback, useMemo } from 'react';
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at wrapSafe (node:internal/modules/cjs/loader:1024:16)
    at Module._compile (node:internal/modules/cjs/loader:1072:27)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1137:10)
    at Module.load (node:internal/modules/cjs/loader:973:32)
    at Function.Module._load (node:internal/modules/cjs/loader:813:14)
    at Module.require (node:internal/modules/cjs/loader:997:19)
    at require (node:internal/modules/cjs/helpers:92:18)
    at eval (webpack-internal:///chartjs-react:1:18)

Hello. Thanks for your report. Can you try to use node.js 15+? If not, you are welcome to create PR.

Hello. Thanks for your report. Can you try to use node.js 15+? If not, you are welcome to create PR.

I am running Node 15.5.0. I managed to get it running by directly using your typescript code in my project, seems it might be related to how nextjs does SSR as it also occurs with their own next/image package on page refresh. For now I will close this since I don't think it's the fault of this project.

FYI, I ran into the same error and was able to solve it by using the next-transpile-modules plugin.