Vfrdtyky

First time trying to do this, so not really sure what I am doing or how to set it up.

I need to debug a library I am using in my application. Originally, I had it installed with npm install @react-pdf/renderer. That wouldn't work well for debugging and I came across this answer describing how to work on a dependency if you need to make modifications to it:

https://stackoverflow.com/a/13302095/3123109

So now I'm doing npm install https://github.com/diegomura/react-pdf/tarball/master which puts a copy of the repo into my node_modules.

I was under the impression it would "just work" after doing this. Of course not that simple...

What I have tried

1. I have NPM running on my application. The first error that comes up is Module not found: Error: Can't resolve '@react-pdf/renderer' in my component where it is contained. Ok, so updated my import to the following to look at the index.js of the library: import { Document } from '@react-pdf/renderer/src.



2. 
   

   Clears up that message. Now I get:

   
   
   

   ERROR in /mnt/c/Users/User/projects/current/client/node_modules/@react-pdf/renderer/src/elements/Page.js 11:22
   
   Module parse failed: Unexpected token (11:22)
   
   You may need an appropriate loader to handle this file type.
   
   |
   
   | class Page extends Base {
   
   >   static defaultProps = {
   
   |     size: 'A4',
   
   |     orientation: 'portrait',
   
   @ /mnt/c/Users/User/projects/current/client/node_modules/@react-pdf/renderer/src/elements/index.js 3:0-26 13:8-12
   
   @ /mnt/c/Users/User/projects/current/client/node_modules/@react-pdf/renderer/src/index.js
   
   

   
   

Looking into it, it sounds like it is a babel-preset-stage-0 issue:

https://stackoverflow.com/a/41412906/3123109

Ok, I add that to .babelrc in the @react-pdf/renderer since it is missing. Same issue.

3. 
   

   I guess I need to add it to my .babelrc which also requires doing npm install --save-dev babel-preset-stage-0 (even though I don't use that in my app, but whatever). Get this error:

   
   
   

   ERROR in ../react/index.jsx
   
   Module build failed (from /mnt/c/Users/User/projects/current/client/node_modules/babel-loader/lib/index.js):
   
   Error: Plugin/Preset files are not allowed to export objects, only functions.
   
   

   
   

Apparently had to do with mixing Babel 6 with Babel 7, the former being related to the stage-0 and the latter being what I am using in my application.

https://stackoverflow.com/a/49183337/3123109

Ok, apparently a dependency issue going on that I'm not sure how to resolve given I've never done this before. That being said, when I did the npm install https://github.com/diegomura/react-pdf/tarball/master, it did install the dependencies in node_module for @react-pdf/renderer.

Questions

1. Do I need to be installing the dependencies for @react-pdf/renderer even though it looks like they were installed with npm install https://github.com/diegomura/react-pdf/tarball/master?




2. If so, where? Do the dependencies need to be added to my app (via adding them to my package.json) or within the node_modules/@react-pdf/renderer directory via npm install in that directory?




3. Do I need to be running npm run ... --watch for @react-pdf/renderer in addition to running it for my app?




4. Or, do I just need to be taking the compiled JS files for @react-pdf/renderer, reading them into my app, then recompiling the JS if I need to make changes?

Well, the developer of @react-pdf/renderer gave me a hand setting up. The way he suggested, as I'm sure there are several ways to do this, was using yarn:

1. Clone react-pdf repo in a separate folder


2. Run yarn install in react-pdf dir


3. Run yarn link in react-pdf dir. This will link the lib to your local version


4. Run yarn watch in react-pdf dir. This will watch for file changes and re-bundle every time


5. Run yarn link "@react-pdf/renderer" in your project to use local bundle

I'd image replacing "yarn" with "npm" would work, but haven't tested it out.

Ya learn something new everyday...