CODEWITHSUNDEEP
reactjsgithubsymlinkstorybooklerna
Enjayy
Enjayy

Reputation: 1074

Symlinking in monorepo - using lerna

I am creating a monorepo component library with react, lerna and storybook to display my components. Each component gets its own package. This way I can import components to multiple projects with out needing the entire User Interface. The main issue that I am facing has to do with symlinking packages.

Example:

I have a Button component/package and a SlideoutMenu component both are unpublished. For display purposes in storybook/development. I would like to import the Button into the SlideoutMenu's story. So that I can use it to trigger the menu. Basically this is a dev dependency. It is not to be included in the build of the SlideoutMenu.

How do I link this type of dependency?

I have tried symlinking them using npm link which works locally but if I push the branch to github, at least currently the symlink is lost when a co-worker pulls the repository which obviously not ideal. Not really sure how to get symlinks to work with git/github

I have also tried to add the dependency like so inside SlideoutMenu's package.json

devDependencies: {
  "ui-button": "^0",
}

this works to import but if I update the ui-button components background color for instance. The ui-button dependency inside SlideoutMenu component will not be updated I tried running lerna bootstrap after making this update but it doesn't seem to update the installed package inside SlideoutMenu.

I would love some input on how to manage a monorepos dependencies and dev dependencies using symlinking and available to co-workers when pulling the repo from github.

Upvotes: 1

Views: 4244

Answers (2)

leerob
leerob

Reputation: 3122

I maintain a project that is very similar - a component library using React, Lerna, Yarn Workspaces, and Storybook. We had to tackle the same problem you're mentioning.

I've published the code to GitHub - try pulling this down and seeing if it works for your situation.

Hope this helps!

Upvotes: 1

light24bulbs
light24bulbs

Reputation: 3151

Adding the dependency was the first step. Then you just call lerna bootstrap and it will link internally and install all external dependencies. Anyone who pulls the repo needs to do that.

Upvotes: 2

Related Questions