0

I'm using dynamic imports in my webpack project to conditionally include some extra JS and SCSS. There's also a main JS bundle and a main CSS bundle. I want to configure webpack so that my dynamically imported SCSS can depend on the main CSS bundle, to prevent duplicated CSS.

I have created a sample project here, in which I have I have the following structure:

/
- index.js
- index.scss
- scss/colors.scss
- components/dynamic.js
- components/dynamic.scss

Both index.scss and dynamic.scss contains @use "./scss/colors.scss";, and in this case I expect the content of colors.scss to only end up in index.css, but this is not the case. Is this possible?

Edit: I just realized, this is not unique for dynamic imports. It's the same behaviour when using multiple entry points.

Sheldor the conqueror
  • 1,154
  • 9
  • 15

0 Answers0