search

tldraw / tldraw-v1

A tiny little drawing app. This is the original 2021-2022 version, released under MIT.
https://old.tldraw.com
MIT License
61 stars 36 forks source link

[bug] ESM packages (browser-fs-access) need to be imported. Use 'import' to reference the package instead #46

Closed abedshamia closed 8 months ago

abedshamia commented 1 year ago

I installed both of @tldraw/tldraw and @tldraw/core packages into my Next 11 app.

First I faced the issue of importing CSS files from node_modules in which I used the next-transpile-modules version 8.0.0 and it appears to be solved.

Then I faced this issue ESM packages (browser-fs-access) need to be imported. Use 'import' to reference the package instead

screencapture-localhost-3000-whiteboard-2023-01-11-17_17_38

I tried many possible solutions but I can't wrap my head around it.

While in the terminal of the app. This error appears 

error - ./node_modules/@tldraw/tldraw/dist/index.mjs
Module parse failed: Identifier '_a' has already been declared (26278:8)
File was processed with these loaders:
 * ./node_modules/@next/react-refresh-utils/loader.js
 * ./node_modules/next/dist/build/babel/loader/index.js
You may need an additional loader to handle the result of these loaders.

While the code in my page is really simple. I just import and use the Tldraw component from the @tldraw/tldraw package.

It would be great to know why is this happening and how to solve it

judicaelandria commented 1 year ago

Hey! can you provide an example (codesandbox) that reproduce this please?