I made a LWC to hold common CSS I want to import across different LWCs that I am working on.

Based on these release notes I created a component called myComponent and tried to import it in the CSS portion of one of my other LWCs, let's call it consumerComponent.

Here's my code.

myComponent Metadata:

<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <description>My Component</description>
    <masterLabel>My Component</masterLabel>

myComponent CSS:

Holds a bunch of css


@import 'c/myComponent';

The API version of the consumerComponent is also 49.

However I am getting the following error: Error during LWC component connect phase: [Class constructor MyComponent cannot be invoked without 'new'].

Any ideas or leads for this?

  • There is a bug in this and here is the work-around Aug 2, 2020 at 9:25

1 Answer 1


Never mind just figured it out.

I am using IntelliJ with Illuminated Cloud. Upon creation of a new LWC Illuminated Cloud instantiates a HTML and JS file in addition to the .css and .js-meta.xml files.

Upon erasing of the HTML and JS files everything worked like a charm.

My guess is that importing the shared CSS from the myComponent is causing a conflict, if it contains HTML, JS files, as that component is not being imported in the HTML as a child component by consumerComponent.

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .