Make React components available as dependency

2

blz? I have some react components here and I need to make them all available in a dependency, style or semantic, how can I do this?

I'm trying to export the components into an index that imports and exports everything but I'm having a problem

In the project that uses dependency on components, the arriving js does not come transpiled

ex: In the project with the components I make an index and import the components as well

[image 1]

In the project that uses the dependency I import the components, but if I send a build it gives this error

[image 2]

If I do not build and start at once, the project is under more than one error in the navigated js because the component js are coming as is

[image 3]

How do you do? and how to solve?

obs: sorry for the image, I can not put more than 1 link

    
asked by anonymous 11.07.2017 / 21:49

1 answer

1

You need to compile your lib before using it, this is the best way to reuse your components in another project.

Knowing this, now the question is, how to do it?

If you are using Webpack , continue to use it, but note the changes you need to make to publish your project as a library , I recommend following the Webpack documentation itself so that you can do this in your project:

link

If you are not using Webpack, I recommend using it, or use Rollup.js which is a specially crafted solution

One important detail for you to cling to is stylesheets . Try extracting them in a .css separate file, if you do not, the styles of your components will be shipped together with the script, which will imply a loss of performance and visually it will seem strange too.

    
25.07.2017 / 23:00