Production build does not include component styles
Los mantenedores suelen responder en 1 día
@tanner-reits ya está trabajando en esto.
Desde el 14/3/2023.
Evaluación
Este issue todavía no se ha evaluado.
Descripción
Prerequisites
- I have read the Contributing Guidelines.
- I agree to follow the Code of Conduct.
- I have searched for existing issues that already report this problem, without success.
Stencil Version
3.0.0
Current Behavior
I am writing one component with the following configuration.
@Component({
tag: 'mpsv-feedback',
styleUrl: 'feedback.css',
shadow: true,
})
I have a definition in the component style itself.
:host {
font-family: "Roboto", sans-serif;
color: var(--gov-color-secondary);
font-size: 16px !important;
margin: 0;
padding: 0;
}
:host * {
box-sizing: border-box;
}
During development everything is fine and styles are generated in the component.

When I build the component, the styles do not appear after the component is generated.

They are clogged in the component chunk itself.

Expected Behavior
I expect the same behavior as in the dev environment.
The component will generate the styles it is assigned.
System Info
System: node 18.15.0
Plaform: darwin (21.6.0)
CPU Model: Apple M1 Pro (8 cpus)
Compiler: .../node_modules/@stencil/core/compiler/stencil.js
Build: 20230228172721
Stencil: 3.1.0 🍕
TypeScript: 4.9.5
Rollup: 2.42.3
Parse5: 7.1.2
Sizzle: 2.42.3
Terser: 5.16.4
Steps to Reproduce
- Install a new project
- Add custom styles
- Set shaddow to true
- Run npm run build
- Upload esm modules to server and try to call a component
Code Reproduction URL
https://github.com/zvitek/webcomponent-styles
Additional Information
- Lenguaje dominante
- TypeScript
- Estrellas
- 13.2k
- Forks
- 865
- Merge medio
- 2 d 16 h
- PR fusionados (30 d)
- 29
Preparar el entorno
- Sin Dockerfile ni archivo de Docker Compose
- Tiene una plantilla de pull request
- Leer la guía de contribución
Primeros pasos
- Lee el issue completo y luego la guía de contribución del proyecto.
- Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
- Haz un fork del repositorio y trabaja en una rama.
- Abre un pull request que haga referencia al número del issue.
Más de stenciljs/core
-
Dificultad 2/5 1-3 horas Aptitud para principiantes 72/100
Los mantenedores suelen responder en 1 día
-
bug(mock-doc): `Element.toggleAttribute()` is missing, so components that use it fail during SSRAbiertotriage
Dificultad 2/5 1-3 horas Aptitud para principiantes 78/100
Los mantenedores suelen responder en 1 día
-
Stencil FOUC styles should use @layer to avoid cascade conflicts with React 19Posiblemente ocupada @johnjenkins la tomó hace 230 días. AbiertoStencil v5
Dificultad 2/5 1-3 horas Aptitud para principiantes 68/100
Los mantenedores suelen responder en 1 día
-
Dificultad 3/5 1-2 días Aptitud para principiantes 45/100
stenciljs/core#7016 · 1 reacción ·
Los mantenedores suelen responder en 1 día
-
Dificultad 4/5 3-5 días Aptitud para principiantes 22/100
Los mantenedores suelen responder en 1 día
Todos los issues de stenciljs/core
Issues similares
-
Dificultad 2/5 1-3 horas Aptitud para principiantes 74/100
Los mantenedores suelen responder en 1 día
-
Dificultad 2/5 1-3 horas Aptitud para principiantes 66/100
open-webui/tether#52 ·
Los mantenedores suelen responder en 1 día
-
`void platform install --app-access public` fails when Cloudflare reports Access is disabledAbierto
Dificultad 2/5 1-3 horas Aptitud para principiantes 72/100
voidzero-dev/void#835 ·
Los mantenedores suelen responder en 1 día
-
Dificultad 2/5 1-3 horas Aptitud para principiantes 72/100
AykutSarac/jsoncrack.com#616 ·
-
Dificultad 2/5 1-3 horas Aptitud para principiantes 72/100
melgarafael/DeskcommCRM#4679 ·
Los mantenedores suelen responder en 1 día