bridgetownrb / bridgetown

A next-generation progressive site generator & fullstack framework, powered by Ruby
https://www.bridgetownrb.com
MIT License
1.16k stars 112 forks source link

esbuild can't import scss files from node_modules #831

Open DEfusion opened 11 months ago

DEfusion commented 11 months ago

Bridgetown Version: bridgetown 1.3.1 "Kelly Butte"

To Reproduce

  1. bridgetown new foo --use-sass
  2. yarn add normalize-scss
  3. Add @import "normalize"; to frontend/styles/index.scss
  4. yarn esbuild

Current behavior It does not compile, with the following error:

✘ [ERROR] Can't find stylesheet to import.
  ╷
1 │ @import "normalize";
  │         ^^^^^^^^^^^
  ╵
  frontend/styles/index.scss 1:9  root stylesheet [plugin sass]

    frontend/javascript/index.js:1:7:
      1 │ import "$styles/index.scss"
        ╵        ~~~~~~~~~~~~~~~~~~~~

  This error came from the "onLoad" callback registered here:

    config/esbuild.defaults.js:151:10:
      151 │     build.onLoad({ filter: /\.(sass|scss)$/ }, async (args) => {
          ╵           ~~~~~~

    at setup (foo/config/esbuild.defaults.js:151:11)
    at handlePlugins (foo/node_modules/esbuild/lib/main.js:1292:21)

I could get around it by changing the import to @import "../../node_modules/normalize-scss/sass/normalize"; however the actual package I'm having trouble with is a private package which itself also imports SCSS from other packages so that is not an option here.

Expected behavior

It should compile.

Computing environment (please complete the following information):

jaredcwhite commented 8 months ago

Can you try @import "normalize-scss/sass/normalize";? It's unclear to me if there's any sort of standard Node package resolution that would actually support just @import "normalize";