Efficiently edit npm package, required as dependency in a project, during its development

Question

I have a git repository with a ReactJS project (built with create-react-app) that has a git submodule. I want to transfer the code of the submodule currently located in src/my-git-submodule folder, to a npm package with the name @company/my-git-submodule.

I created new local directory outside of the project:

• username/WebstormProjects/my-git-submodule <- this one
• username/WebstormProjects/reactjs-project

Copied the code from the git submodule and ran npm init, creating a package.json with the details of the package. (Not sure if it's relevant, but it's hosted in a private registry and the reactjs project is configured to fetch packages from it -- using .yarnrc config file).

Code is written using ES6, so I installed babel, webpack and the tools/plugins/presets needed for building compatible code that can be used in my ReactJS website.

I added the new npm package as dependency and it is working fine. I can import components, functions and other stuff I have in the package in my ReactJS website.

It works as expected, but if I want to change something to the package and test it in my project, I have to publish new version, then in the reactjs project to update it, and then test it (I have to make some adjustments because some of its features need to be changed since it doesnt reside insrc folder of the project).

This process takes time and really slows down the development process of both the reactjs project and the npm package.

I tried adding the npm package directly from the local folder, but I still need to run yarn add ../my-git-submodule each time I change the code and build it with babel + webpack.

Answer 1

You want to use the npm link or yarn link commands.

In the case of Yarn, the v1 doc is more explicit about the use case.