pqina / flip

⏳ The online version of the classic flip clock
https://pqina.nl/flip/
MIT License
874 stars 89 forks source link

Cannot use import statement outside a module #37

Closed Vivek205 closed 2 years ago

Vivek205 commented 2 years ago

I tried using this module with NextJs but facing an error

SyntaxError: Cannot use import statement outside a module

/node_modules/@pqina/flip/dist/flip.module.js:1
import Tick from '../tick/tick.core.module';
^^^^^^

SyntaxError: Cannot use import statement outside a module
    at wrapSafe (internal/modules/cjs/loader.js:984:16)
    at Module._compile (internal/modules/cjs/loader.js:1032:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1097:10)
    at Module.load (internal/modules/cjs/loader.js:933:32)
    at Function.Module._load (internal/modules/cjs/loader.js:774:14)
    at Module.require (internal/modules/cjs/loader.js:957:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.@pqina/flip (/Users/vivek/Documents/Singularity/snet-airdrop/.next/server/pages/index.js:449:18)
    at __webpack_require__ (/Users/vivek/Documents/Singularity/snet-airdrop/.next/server/webpack-runtime.js:33:42)
    at eval (webpack-internal:///./snet-ui/FlipClock.tsx/Flip.tsx:7:69) {
  page: '/'
}
rikschennink commented 2 years ago

A very straightforward google query yielded this result: https://stackoverflow.com/questions/66244968/cannot-use-import-statement-outside-a-module-error-when-importing-react-hook-m

arnotixe commented 1 year ago

Did you ever get this working in nextjs @vivek205? I tried wrapping with next-transpile-modules but get some other error

next-transpile-modules - transpiled: …/@pqina/flip/dist/flip.module.js
next-transpile-modules - transpiled: …/@pqina/flip/dist/tick.view.flip.module.js
next-transpile-modules - transpiled: …/@pqina/flip/tick/tick.core.module.js
next-transpile-modules - transpiled: …/@pqina/flip/dist/flip.module.js
next-transpile-modules - transpiled: …/@pqina/flip/dist/tick.view.flip.module.js
next-transpile-modules - transpiled: …/@pqina/flip/tick/tick.core.module.js
event - compiled client and server successfully in 830 ms (627 modules)
wait  - compiling /_error (client and server)...
event - compiled client and server successfully in 71 ms (628 modules)
error - node_modules/@pqina/flip/dist/flip.module.js (3:0) @ eval
error - TypeError: Cannot read property 'plugin' of null
    at eval (webpack-internal:///./node_modules/@pqina/flip/dist/flip.module.js:9:64)

most likely related to the transpile hack, but… maybe you got around the problem in some other way?

justEhmadSaeed commented 1 year ago

@arnotixe I got the same error.

Hallyson34 commented 1 year ago

@arnotixe Same error too, you find a solution? Please help me