divriots / webcomponents.dev

Web Components IDE
https://webcomponents.dev
53 stars 4 forks source link

Published packages structure feels strange #18

Closed daKmoR closed 4 years ago

daKmoR commented 4 years ago

Describe the bug When publishing a package it looks something like this

project @wcd/dakmor.mdjs-story https://webcomponents.dev/edit/Ecc0UWriZdTwlGiomLvE

.
└── dakmor.mdjs-story
    ├── dist
    │   ├── index.js
    │   ├── mdjs-story.js
    │   └── MdJsStory.js
    └── src
        ├── index.js
        ├── index.stories.js
        ├── mdjs-story.js
        └── MdJsStory.js

which feels strange for 2 reasons. 1) why is everything double in dist and src? 2) it means I need to import like import '@wcd/dakmor.mdjs-story/dist/mdjs-story.js' e.g. I would like to get rid of the "dist" in that path

imho the ideal structure would have

e.g. something like this

.
└── dakmor.mdjs-story
    ├── src
    │   ├── index.stories.js
    │   ├── mdjs-story.js
    │   └── MdJsStory.js
    ├── index.js
    └── mdjs-story.js
georges-gomes commented 4 years ago

Thanks for reporting. It makes sense and we are changing it right now. I will report when it's done 👍

georges-gomes commented 4 years ago

Hi @daKmoR

I was in the middle of the change and I had a little bit of a doubt because it felt good in the code and I found a few libraries with dist or lib folder for the entry points on NPM: rollup, terser, gzip-size...

Some additional information to see if it matches your expectations

/src can be omitted by unchecking "SOURCES" in NPM dialog

image

Finally, we do fill the main and module in package.json so you can use import '@wcd/dakmor.mdjs-story And it will point to dist/index.js as it should be.

You need mutiple entry-points? That's why the dist folder is a little bit "in the way" ?

georges-gomes commented 4 years ago

You want to export the "class only" and the "customElement.define" side effet separately right?

I'm just thinking out loud. I'm wondering if the class shouldn't be in /dist and then 2 entry-point at root importing it. So we could separate the implementation from the "NPM API" sort of speak...

And I wonder if I can do that automatically via options... What are your thoughts?

daKmoR commented 4 years ago

I am in the buildless fraction so my source is what I distribute. No need to for any processing.

imho babel or any other optimization step should be on the app level and not when distributing elements.

I need multiple entry points as I don't want to have side effects in my main/module. (as this prevents, for example, tree shaking or requires a specific importing order which can be "impossible" if you have reexports)

georges-gomes commented 4 years ago

OK so moving /dist to the root is not going to help...

What if I make a buildless fraction 😄 checkbox in the NPM publish so you get your source at root and that's it?

daKmoR commented 4 years ago

my usual workflow for publishing is to purely run npm publish - no processing no moving of files or anything. e.g. take my folder and put all* files as is on npm

It's not a huge deal... still it feels kinda like that wc.dev stand in my way for publishing in the way I want 🤔

I am however probably a very specific use case 😅 so I fully understand if that is not something that is supported...

* files which are in the files section of the package.json

daKmoR commented 4 years ago

What if I make a buildless fraction 😄 checkbox in the NPM publish so you get your source at root and that's it?

I think that should work 🤗

georges-gomes commented 4 years ago

In review

image
daKmoR commented 4 years ago

looking good 🤗

georges-gomes commented 4 years ago

@daKmoR it's on. If there is anything else, please let us know! 👍