search

ionic-team / stencil

A toolchain for building scalable, enterprise-ready component systems on top of TypeScript and Web Component standards. Stencil components can be distributed natively to React, Angular, Vue, and traditional web developers from a single, framework-agnostic codebase.
https://stenciljs.com
Other
12.5k stars 784 forks source link

loader in dev mode #2816

Open dakom opened 3 years ago

dakom commented 3 years ago

Stencil version:

+-- @stencil/core@2.4.0
`-- @stencil/react-output-target@0.0.9
  `-- @stencil/core@2.4.0 deduped

I'm submitting a:

[x] bug report

Current behavior: stencil build produces the loader stuff, but stencil build --dev does not

Expected behavior: stencil build --dev should produce the loader stuff

Other information: I'm not entirely clear on how the loader stuff is used, only that when I build with the React bindings (e.g. react-output-target) it fails without that.

Paul-Hebert commented 3 years ago

I ran into a similar issue. For a client we're building a library of web components. We're documenting these in Storybook. I'd like to be able to run Storybook and Stencil at the same time and have Storybook reload whenever Stencil components change.

To do so I'm loading our components into Storybook using loader. However, this isn't generated in dev mode. I've switched to using the non-dev build for my Stencil development, but this feels hacky. Is there a better way to hook into the dev output?

Thanks!

janrembold commented 3 years ago

It seems to me that this is a general problem with the integration in Storybook. Are there already any efforts to solve this issue? And are there any reasons why the loader is only generated for the prod build?

If there is no technical reason I would like to propose something like a --loader or even --no-loader flag for the CLI to control or prevent the generation of these files.

marcolanaro commented 3 years ago

I ran into a similar issue. For a client we're building a library of web components. We're documenting these in Storybook. I'd like to be able to run Storybook and Stencil at the same time and have Storybook reload whenever Stencil components change.

To do so I'm loading our components into Storybook using loader. However, this isn't generated in dev mode. I've switched to using the non-dev build for my Stencil development, but this feels hacky. Is there a better way to hook into the dev output?

Thanks!

Have you consider using the script "build.watch": "stencil build --docs --watch"?

Paul-Hebert commented 3 years ago

Thanks @marcolanaro !

That's the script I ended up using. I was just curious why I wasn't able to use the --dev flag while doing local development that relied on the loader files for integrations.

alicewriteswrongs commented 1 year ago

Hey all,

Sorry that this didn't get a response from the Stencil team for quite a while. It looks like there's a workaround here which hopefully has at least got things moving along.

As far as I'm aware the omission of the loader output from stencil build --dev is intentional, but there's no reason that couldn't change in the future! Accordingly, I'm going to mark this as a feature request to gauge interest from the community.