Update: Webpack was deprecated in favor of Stencil compiler (v. 0.5.0)
We released an alpha version of the zero-configuration package manager for React components.
It helps developers to publish and to reuse any component directly from an existing app, no metadata or configuration files required. Basically, Domy will reuse the configuration data of your main app to transpile the component (ex. webpack.config.js).
Custom Elements storage
Utilization
Sign up by using your username, password and email:
domy signup
Log in to the system from another computer or using another account:
domy login
Compile the project using Stencil and after publish it, submitting the whole directory:
domy publish --version 0.1.0
Execute the command in the root (base) directory of your project
The version is optional. Non-versioned components will be sent to the master branch
It's possible to publish just one component by passing its class name
domy publish MyComponent --version 0.1.0
Install the component in another project using its class name:
domy install MyComponent --version 0.1.0
Installed components will be tracked in package.json webcomponents compartment
To install all components listed in package.json webcomponents compartment, drop the class name:
domy install
Components are installed in the node_modules/@ directory and could be reused in another Stencil application:
// master is a non-versioned…The current release supports only React components, no Angular or Web components for the moment. It's coming after alpha test stage.
In order to start your journey into the magical world of the Domy's package manager, install it first:
npm install -g domy-cli
... and create your personal account by executing:
domy signup
it will ask for your username, password, and email.
Then, navigate up to the root directory of your best React app and publish the desired component to the registry. Domy will detect the configuration of your main app and will apply it to the process of packing the component:
domy publish <name> <file>
In the above example, we use angle brackets as an example of parameters that are expected. In our case, it is the name of a component and the path to the file where it is stored. The path is relative to the root of the app.
Finally, navigate to the root directory of another project with initiated npm package.json and execute the command install:
domy install <name>
It will create new components directory in the root of your project and will drop component right there. Installed component can be required as a simple local file/module.
What else? I supposed that's it for now. Come as you are, try our awesome library aka package manager and don't forget to give us a star on Github. Thanks
Top comments (23)
Oh, great!
Oh, wait...
Thanks for the click-bait 😒
Hey Goran,
Changed the name of the article. It was not supposed to be a click-bait.
Cheers!
I believe work on angular or others will be done too, no?
Hi Nkansah,
Thanks for the question. We received a lot of negative feedback on the idea of separating Angular/React components and completely ignoring Web Components in alpha release, it made us to redo our backlog and prioritize web components support.
Now, we consider to create a package manager for web components only, where any web component could be reused with any framework Angular/Vue/React, but without the support for existing framework specific components.
What do you think about?
Kudos on your effort. However, you should change the article title. It's rather off-putting to read an article entitled "The package manager for web components" only to find that it doesn't actually support web components. I get that it's alpha, but I'm not interested unless it supports actual web components (or components from a library like Polymer). Thanks.
I agree, it would be great to have titled this: The Package Manager for React Components
It's an interesting concept, but it's not currently a package manager for Web Components 😏
Hi Jordan,
Changed the title of the article. Thanks for the tips.
Peace!
Much clearer, thanks!
I’m happy to help.
Do not you think we rather have one package manager, then multiple like bower? Look Ruby, Python, PHP, Perl, they use 1. What is better to use two instead of one?
I see your backend is based on Scala eg. Java, that is that have Maven and Gradle. I suppose people like one repo like using one that only for React. :)
Just an opinion...
Hi Patrik,
Interesting point. We just want to put away HTML & CSS from the NPM registry, in our opinion it is not the best place to keep it. In the end of the day, NPM is Node.js registry.
Have a good one!
So isnt it like bower then?
Well, our awesome community of web developers has cutting edge projects like webcomponents.org and Polymer, but we don't have a place to call home, a place where components could be stored. So, Domy is more like a HTML/CSS/JS storage, where JS is just a guest.
Cheers!
Ok, got it. Thanks.
I got confused some how, what's the difference between domy and npm? I can import package from node_modules anyway?
You mean i can just publish one of my component in my repo, which is a single jsx, and reuse it in other repo instead of copying the file or make a npm package and publish it with npm? What if my component depend on another js/css file?
Hi Sleagon,
First of all, thank you for your question and sorry for confusing you. I'll try to explain it better in the next article.
Now, you are completely right, it is just another way to publish and share components, nothing more. At the moment, Domy will webpack components completely with their JS dependencies. In next release, the entire tree of dependent components will be created, detecting all imported components and packing each one of them separately, in "isolated environment".
We haven't tested yet import of standalone CSS files into the component, but it will be nailed as fast as possible.
Have a good one!
Actually, i do think it pretty meaningful once the web component part finished, nice try~~
Excited to try it. Where are the components stored online?
Hey SeanKPS,
Thank you so much for your attention, it matters a lot for us.
We store all components in cloud (GCP). We built an awesome backend for this purpose using Scala, Play! and Etcd.
Peace!
Its awesome lib.
Will try for sure.
Some comments may only be visible to logged-in visitors. Sign in to view all comments.