JonaThan HaBer
JonaThan HaBer

Reputation: 97

What is the simplest way to share react components between projects?

How can I share components across multiple react projects without having to publish them on a public package manager like NPM?

Upvotes: 8

Views: 14149

Answers (4)

Ross Sheppard
Ross Sheppard

Reputation: 870

Option 1: You can use npm and use private packages so they're not external facing. There are also artifactories and scoped packages that usually represent company-wide projects that can be public or private. See https://docs.npmjs.com/private-modules/intro and https://docs.npmjs.com/misc/scope.

Option 2: Essentially, you can develop projects with a flattened structure. You can then import various projects and/or components into other projects or folders. This is entirely dependent on your codebase and configuration. With this model though, a lot of times publishing to npm comes fairly naturally since each folder may be its own project with its own package.json.

Updated:

Option 3: Bit focuses on the composability of components from everything from the little things like a button to the actual view and app itself—each target is its own package. Overall, it's an opinionated, yet customizable framework that can enable quicker development, managed dependencies, and organized code.

Option 4: RushJS is a monorepo manager built by Microsoft that allows for flexibility of different kinds of apps and services utilizing pnpm underneath (as opposed to yarn and npm), which alleviates problems that stem from dependency issues.

Upvotes: 7

David L
David L

Reputation: 723

Check out Bit:

Bit is an open-source cli tool for collaborating on isolated components across projects and repositories. Use Bit to distribute discrete components from a design library or a project into a standalone reusable package and utilize it across applications.

Upvotes: 4

Jack Pilowsky
Jack Pilowsky

Reputation: 2303

You could create a repo of shared components and then have your Node.js start script call a shell script to do a git pull from that repo and the move the shared components from that directory to your project's directory. That way, every time you call run 'npm start' you will have the latest version of the shared components loaded into your project

Upvotes: 1

Jack
Jack

Reputation: 3057

You could also upload them to a private git repo such a Github and then pull them in from there.

Ryanve has a nice example over here: https://stackoverflow.com/a/28729646/1592783

Upvotes: 3

Related Questions