Open sidharthramesh opened 3 years ago
I have mentioned only once in my global css src/global.css
:
:host {
background-color: aqua;
}
and in my component css src/components/my-component/my-component.css
:
:host {
display: block;
}
But there is something weird going on in the build/my-component.entry.js
. Seems like the css is repeated multiple times. Also globalCss
is not initialized?
import { r as registerInstance, h } from './index-78323a20.js';
function format(first, middle, last) {
return (first || '') + (middle ? ` ${middle}` : '') + (last ? ` ${last}` : '');
}
const globalCss = globalCss + globalCss + globalCss + globalCss + globalCss + ":host{background-color:aqua}:host{background-color:aqua}:host{background-color:aqua}:host{background-color:aqua}:host{background-color:aqua}:host{background-color:aqua}";
const myComponentCss = globalCss + ":host{display:block}";
const MyComponent = class {
constructor(hostRef) {
registerInstance(this, hostRef);
}
getText() {
return format(this.first, this.middle, this.last);
}
render() {
return h("div", { class: "text-purple-600" }, "Hello, World! I'm ", this.getText());
}
};
MyComponent.style = myComponentCss;
export { MyComponent as my_component };
Hey there, thank you for the patience getting back to you. The new team is getting started and we're working through the backlog now. Could you help me out by creating a reproduction repo? I'd love to take a peek at this sooner than later.
@sidharthramesh I had a similar issue. I'm afraid I haven't looked into it properly but I was able to resolve it for now by modifying the file extension to .pcss
.
Everything works fine without it, but adding
injectGlobalPaths
to the PostCSS config causes this error:I am trying to use tailwindcss with PostCSS. The error can be reproduced with this branch. Adding the injectGlobalPaths always fails. Seems like some variables aren't defined on the client side.