Can't resolve 'react-p5' about react-p5

[hug0hq]

This error is because the ./build/index.js is not present in the npm package

[MohammadMitwaly]

Hello,
I'm also facing a similar issue in a TypeScript project.
After creating a separate component and exporting it:

import React from "react";
import Sketch from "react-p5"
import p5Types from "p5"; //Import this for typechecking and intellisense

interface MainSketchProps {
	//Your component props
}

export const MainSketch: React.FC<MainSketchProps> = (props: MainSketchProps) => {
	let x = 50;
	const y = 50;

	//See annotations in JS for more information
	const setup = (p5: p5Types, canvasParentRef : Element) => {
		p5.createCanvas(500, 500).parent(canvasParentRef);
	};

	const draw = (p5: p5Types) => {
		p5.background(0);
		p5.ellipse(x, y, 70, 70);
		x++;
	};

	return <Sketch setup={setup} draw={draw} />;
};

Then importing it:

import React from 'react';
import './App.css';
import {MainSketch} from './Components/MainSketch';

function App() {
  return (
    <div className="App">
      <MainSketch/>
    </div>
  );
}

export default App;

After running npm start, I get:

Module not found: Can't resolve 'react-p5' in 'pathToProject\project-name\src\Components'

I created the project using npx create-react-app --template typescript

[hug0hq]

@MohammadMitwaly
@Gherciu needs to approve #44
As a temp fix you can downgrade to v1.3.6

[AshutoshAgrawal2004]

@hug0hq Thanks for the pull request. Looks like they still haven't approved it though.
Downgrading to lower versions is still showing the same problem. Is there any way to fix it. I am trying to deploy my react app on netlify and keeps failing.

[TimoLange98]

@MohammadMitwaly @AshutoshAgrawal2004 I fixed it by cloning this project, run the build script so it creates a build folder with an index.js in it. That folder you can copy into the react-p5 folder in your node_modules folder of your project.

[Gherciu]

pls try to reinstall npm i react-p5@latest fixed in #44