title: Stuck porting paperjs to react/nodejs
body: <p>I'm trying to port some paperjs code into a new react application. But I ran into some limitations. </p>
  
  <p>In HTML:
  Currently I have 2 animation files in paperjs and for each one I have an HTML file which works with </p>
  
  
  
  <p>In React : The following works </p>
  
  <pre><code> componentDidMount() {
      var canvas = document.getElementById("myCanvas");
      paper.setup(canvas);
  
     require('./Lesson_1.js');
  
    paper.view.draw();
  }
  </code></pre>
  
  <p>In React : The problem</p>
  
  <p>I need to dynamically change the argument into require() based on the user choice, ...BUT</p>
  
  <pre><code>const lesson = './Lesson_1.js';
  require(lesson) 
  </code></pre>
  
  <p>does not work as the require() function needs a literal !!</p>
  
  <p>Question 1: Is there a workaround for this so I could require a lesson of my choice, since I may have many more lessons? React seems to ignore the script tags </p>
  
  <p>Question 2: Since this component does not mount again when the user chooses another lesson, how do I clear the same canvas and reload a fresh lesson js file?</p>
  
  <p>I have no problem, the way it works currently but porting to react is a problem. Someone suggested to be to keep running the old way and create an iframe in react to show the contents, but I was looking for a cleaner solution in react without dependencies to other programs.</p>
  
  <p>Thanks for your help.</p>