bug: includeGlobalScripts doesn't work as expected
Prerequisites
- [x] I have read the Contributing Guidelines.
- [x] I agree to follow the Code of Conduct.
- [x] I have searched for existing issues that already report this problem, without success.
Stencil Version
4.28.3
Current Behavior
Hello,
I'm trying to archive the old behaviour back, which adds the .hydrated class to the HTML element.
I added a global script to my stencil.config.ts which has following code:
export default () => {
window.addEventListener('appload', () => {
document.documentElement.classList.add('hydrated');
});
};
for the dist output targets it works as expected but for output targets which uses dist-custom-elements it's not working as expected even after adding includeGlobalScripts: true to the stencil.config.ts.
I tested it by importing my stencil standalone components into my application.
Expected Behavior
I expect, after adding one Stencil Angular Standalone component to my Angular App, the global script runs initially.
System Info
Steps to Reproduce
- Create a Global Script
- Define it in the stencil.config.ts
- Add includeGlobalScripts to the "dist-custom-elements"
- Generate Angular Standalone Output Targets
- Import these components into your Angular App
Code Reproduction URL
..
Additional Information
No response
I'm trying to archive the old behaviour back, which adds the
.hydratedclass to the HTML element.
We have removed this because we didn't see any purpose for this anymore as there is no indication that users still use Stencil as static site generator. Can you elaborate on your use case?
for the
distoutput targets it works as expected but for output targets which usesdist-custom-elements
It looks like global scripts are only injected when using dist as output target. You can workaround this by injecting your global script before setting the script to the dist-custom-element asset. In general I would not recommend using Stencils global script primitive.