Setting up git npm dependency for debugging










1















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.




  1. 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?










share|improve this question


























    1















    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.




    1. 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?










    share|improve this question
























      1












      1








      1


      1






      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.




      1. 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?










      share|improve this question














      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.




      1. 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?







      javascript node.js git npm webpack






      share|improve this question













      share|improve this question











      share|improve this question




      share|improve this question










      asked Nov 14 '18 at 23:21









      sockpuppetsockpuppet

      1,53941833




      1,53941833






















          1 Answer
          1






          active

          oldest

          votes


















          1














          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...






          share|improve this answer






















            Your Answer






            StackExchange.ifUsing("editor", function ()
            StackExchange.using("externalEditor", function ()
            StackExchange.using("snippets", function ()
            StackExchange.snippets.init();
            );
            );
            , "code-snippets");

            StackExchange.ready(function()
            var channelOptions =
            tags: "".split(" "),
            id: "1"
            ;
            initTagRenderer("".split(" "), "".split(" "), channelOptions);

            StackExchange.using("externalEditor", function()
            // Have to fire editor after snippets, if snippets enabled
            if (StackExchange.settings.snippets.snippetsEnabled)
            StackExchange.using("snippets", function()
            createEditor();
            );

            else
            createEditor();

            );

            function createEditor()
            StackExchange.prepareEditor(
            heartbeatType: 'answer',
            autoActivateHeartbeat: false,
            convertImagesToLinks: true,
            noModals: true,
            showLowRepImageUploadWarning: true,
            reputationToPostImages: 10,
            bindNavPrevention: true,
            postfix: "",
            imageUploader:
            brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
            contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
            allowUrls: true
            ,
            onDemand: true,
            discardSelector: ".discard-answer"
            ,immediatelyShowMarkdownHelp:true
            );



            );













            draft saved

            draft discarded


















            StackExchange.ready(
            function ()
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53310242%2fsetting-up-git-npm-dependency-for-debugging%23new-answer', 'question_page');

            );

            Post as a guest















            Required, but never shown

























            1 Answer
            1






            active

            oldest

            votes








            1 Answer
            1






            active

            oldest

            votes









            active

            oldest

            votes






            active

            oldest

            votes









            1














            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...






            share|improve this answer



























              1














              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...






              share|improve this answer

























                1












                1








                1







                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...






                share|improve this answer













                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...







                share|improve this answer












                share|improve this answer



                share|improve this answer










                answered Nov 16 '18 at 17:17









                sockpuppetsockpuppet

                1,53941833




                1,53941833





























                    draft saved

                    draft discarded
















































                    Thanks for contributing an answer to Stack Overflow!


                    • Please be sure to answer the question. Provide details and share your research!

                    But avoid


                    • Asking for help, clarification, or responding to other answers.

                    • Making statements based on opinion; back them up with references or personal experience.

                    To learn more, see our tips on writing great answers.




                    draft saved


                    draft discarded














                    StackExchange.ready(
                    function ()
                    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53310242%2fsetting-up-git-npm-dependency-for-debugging%23new-answer', 'question_page');

                    );

                    Post as a guest















                    Required, but never shown





















































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown

































                    Required, but never shown














                    Required, but never shown












                    Required, but never shown







                    Required, but never shown







                    這個網誌中的熱門文章

                    How to read a connectionString WITH PROVIDER in .NET Core?

                    Node.js Script on GitHub Pages or Amazon S3

                    Museum of Modern and Contemporary Art of Trento and Rovereto