yuri-becker / react-jigsaw-puzzle

🧩 Simple plug-and-play React component for jigsaw puzzles
https://yuri-becker.github.io/react-jigsaw-puzzle/
GNU General Public License v3.0
24 stars 14 forks source link

InternalError Metro has encountered an error: Indeed, none of these files exist: #1

Closed emmanuelOpara777 closed 3 years ago

emmanuelOpara777 commented 3 years ago

I just added this package to my project but it's returning this error upon running my application.

[Error: InternalError Metro has encountered an error: While trying to resolve module react-jigsaw-puzzle from file C:\Users\dell\Desktop\jigsaw\App.js, the package C:\Users\dell\Desktop\jigsaw\node_modules\react-jigsaw-puzzle\package.json was successfully found. However, this package itself specifies a main module field that could not be resolved (C:\Users\dell\Desktop\jigsaw\node_modules\react-jigsaw-puzzle\lib\src\index.js. Indeed, none of these files exist:

I checked this folder: node_modules\react-jigsaw-puzzle\lib\src\index.js and discovered that it does not exist. Please I need help on how to resolve this issue.

Thank you in advance.

yuri-becker commented 3 years ago

Hi Emmanuel,

thank you for filing an issue. I fixed the main file declaration in the package.json and published it as 1.0.2 to npm. Please let me know if that resolved your problem.

emmanuelOpara777 commented 3 years ago

@yuri-becker thanks for your quick response. The error message changed to: [Error: undefined Unable to resolve module ./jigsaw-puzzle.css from ...\jigsaw\node_modules\react-jigsaw-puzzle\lib\jigsaw-puzzle.js: image

yuri-becker commented 3 years ago

Im not sure about this one. The css file should definitely be there. Does Metro support css?

emmanuelOpara777 commented 3 years ago

@yuri-becker the CSS file is there but it's not seeing it. I don't know if Metro Bundler supports CSS or not.

SHANbic commented 3 years ago

Im using next.js for my app and I want to add a puzzle game using react-jigsaw-puzzle. Im also getting an error and from the next documentation, here's how to address the issue:

Compiled dependencies do not have references to CSS files, or any other files that require bundler-specific integrations.

The dependency should also provide instructions about what CSS needs to be imported by you, in your application.

_Importing CSS files within nodemodules cannot be supported because we cannot know the correct behavior:

Should the file be consumed as Global CSS or CSS Modules? If Global, in what order does the file need to be injected? If Modules, what are the emitted class names? As-is, camel-case, snake case? Etc...

The same doc states that the maintainer should publish a compiled version of his/her dependency.

https://nextjs.org/docs/messages/css-npm

Hope this helps @yuri-becker

yuri-becker commented 3 years ago

Hi @SHANbic,

thank you very much for the information. I will update the package later today.

yuri-becker commented 3 years ago

@SHANbic @emmanuelOpara777 I've removed the CSS import from inside the module. Let me know if that fixed your problem.

emmanuelOpara777 commented 3 years ago

@yuri-becker that did not fix it. Recent error message: Unable to resolve module react-jigsaw-puzzle/lib/jigsaw-puzzle.css from ...\jigsaw\App.js: react-jigsaw-puzzle/lib/jigsaw-puzzle.css could not be found within the project or in these directories: node_modules

yuri-becker commented 3 years ago

@emmanuelOpara777 The CSS file should be there. Can you check that?

SHANbic commented 3 years ago

@yuri-becker thx its all good now! @emmanuelOpara777 did you update the dependency version in your package.json?