wmr icon indicating copy to clipboard operation
wmr copied to clipboard

Importing CSS from node_modules in SCSS does not work

Open zgoda opened this issue 2 years ago • 0 comments

Describe the bug In SCSS importing CSS file from installed package results in 404.

To Reproduce Steps to reproduce the behavior in default starter:

  1. Rename public/style.css to public/style.scss, update public/index.html and install sass
  2. Install some css package, eg @csstools/normalize.css
  3. Add import in public/style.scss at the top: @import "../node_modules/@csstools/normalize.css/normalize.css";
  4. See error in terminal: 404 ./public/node_modules/@csstools/normalize.css/normalize.css - File not found

Expected behavior

  • Importing installed CSS files works exactly as with installed SCSS files.
  • Importing installed CSS files works exactly as with local CSS files.

Bug occurs with:

  • [x] wmr or wmr start (development)
  • [x] wmr build (production)
  • [x] wmr serve

Desktop (please complete the following information):

  • OS: Ubuntu 20.04
  • Browser: n/a
  • Node Version: v14.17.6
  • WMR Version: 3.7.1

Additional context

When built, resulting CSS asset contains following line:

@import"../node_modules/@csstools/normalize.css/normalize.css";/*!

This of course fails also when served:

404 /node_modules/@csstools/normalize.css/normalize.css  - Not Found

Importing local CSS file works OK, importing installed SCSS also works fine. The path to installed CSS does not make much difference, it fails with relative path as in provided example and with simplified import by package name ( import '@csstools/normalize.css/normalize.css';).

zgoda avatar Sep 08 '21 12:09 zgoda