Theo's Typesafe Cult•2y ago

ct3a + react-hexgrid npm package = "Cannot use import statement outside a module"

So I'm a bit confused about this and it's somewhat hard to google cause content mills spam the search with unrelated(?) beginner tutorials... Basically, when I try to import from the [email protected] npm package from a ct3a app, I get the error on page load. Any hints for understanding this problem are appreciated. FWIW, I tried the package with a create-react-app and at least it spat out a webpage (with a couple warnings/errors). Here's a github minimal example to run: https://github.com/cyremur/t3-hexgrid-minmal-error Steps to reproduce: 1. create-t3-app 2. npm i react-hexgrid 3. put import { Hexagon } from 'react-hexgrid'; and const hexes = GridGenerator.hexagon(6); in index.tsx Error message:

Server Error
SyntaxError: Cannot use import statement outside a module

This error happened while generating the page. Any console logs will be displayed in the terminal window.
Call Stack
<unknown>
file:///home/cyremur/t3hextest/node_modules/react-hexgrid/lib/index.js (1)

Server Error
SyntaxError: Cannot use import statement outside a module

This error happened while generating the page. Any console logs will be displayed in the terminal window.
Call Stack
<unknown>
file:///home/cyremur/t3hextest/node_modules/react-hexgrid/lib/index.js (1)

GitHub

GitHub - cyremur/t3-hexgrid-minmal-error

Contribute to cyremur/t3-hexgrid-minmal-error development by creating an account on GitHub.

1 Reply

cyremur•2y ago

Solution:

  transpilePackages: ["react-hexgrid"]

  transpilePackages: ["react-hexgrid"]

Gaming

Programming

ct3a + react-hexgrid npm package = "Cannot use import statement outside a module"