How to connect reactjs and paperjs with paperscript?

[Leonid Kislov]

Hello, please tell me how to properly connect reactjs and paperjs and use paperscript.
It is necessary to run the paperjs script when going to the page. And all this is inside the reactjs application. 
I am attaching 2 files that I already have and they work. But I don’t understand how to use paperscript in draw.js, it only works directly in js. But even so, for some reason only a small window is allocated for drawing, but I can probably solve that. Tell me how to do it better (if my option seems stupid to you) and most importantly, how to connect paperscript. Sorry for the errors in the text, I don't know English well.

//------Canvas.js-----------------------

import React, { useRef, useEffect } from 'react';

import Paper from 'paper';

import draw from './draw';

const Canvas = props => {

 

  const canvasRef = useRef(null)

 

  useEffect(() => {

   

    const canvas = canvasRef.current;

    Paper.setup(canvas);

    draw();

  }, []);

 

  return <canvas ref={canvasRef} {...props} id="canvas" resize="true" />

}

export default Canvas;

//------draw.js---------

import paper from 'paper'

const draw = () => {

   

   let myPath = new paper.Path()

   paper.view.onMouseDown = (event) => {

      myPath.strokeColor = 'black'

      myPath.strokeWidth = 3

   }

   paper.view.onMouseDrag = (event) => {

      myPath.add(event.point)

   }

   paper.view.draw()

}

export default draw