parcel-bundler / parcel

The zero configuration build tool for the web. 📦🚀
https://parceljs.org
MIT License
43.52k stars 2.27k forks source link

Can't find stylesheet to import for build but not serve #9942

Open steinybot opened 2 months ago

steinybot commented 2 months ago

🐛 bug report

parcel serve works fine but parcel build fails with:

@parcel/transformer-sass: Can't find stylesheet to import.
  ╷
5 │ @import "~bootstrap/scss/bootstrap";
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵

This looks to be the same issue as in https://github.com/parcel-bundler/parcel/issues/4609.

🎛 Configuration (.babelrc, package.json, cli command)

{
  "name": "cv",
  "version": "1.0.0",
  "description": "Jason Pickens' CV",
  "main": "index.js",
  "dependencies": {
    "bootstrap": "^5.3.3",
    "bootstrap-icons": "^1.11.3"
  },
  "devDependencies": {
    "@parcel/transformer-sass": "^2.12.0",
    "parcel": "^2.12.0"
  },
  "scripts": {
    "start": "parcel serve src/index.html --public-url / --dist-dir dist",
    "start-cover-letter": "parcel serve src/cover-letter.html --public-url / --dist-dir dist",
    "build": "parcel build src/index.html --dist-dir dist",
    "test": "echo \"Error: no test specified\" && exit 1",
    "clean": "rm -rf dist"
  },
  "keywords": [],
  "author": "steinybot",
  "license": "ISC"
}

I don't have babel config. Should I?

🤔 Expected Behavior

parcel build should behave the same as parcel serve w.r.t resolving files.

😯 Current Behavior

$ npm run build                                                                                                                                                 [13:11:28]

> cv@1.0.0 build
> parcel build src/index.html --public-url / --dist-dir dist

🚨 Build failed.

@parcel/transformer-sass: Can't find stylesheet to import.
  ╷
5 │ @import "bootstrap/scss/bootstrap";
  │         ^^^^^^^^^^^^^^^^^^^^^^^^^^
  ╵
  src/scss/styles.scss 5:9  root stylesheet

  Error: Can't find stylesheet to import.
    ╷
  5 │ @import "bootstrap/scss/bootstrap";
    │         ^^^^^^^^^^^^^^^^^^^^^^^^^^
    ╵
    src/scss/styles.scss 5:9  root stylesheet
      at Object.wrapException (/Users/jason/src/cv/node_modules/sass/sass.dart.js:2307:43)
      at /Users/jason/src/cv/node_modules/sass/sass.dart.js:82564:25
      at _wrapJsFunctionForAsync_closure.$protected (/Users/jason/src/cv/node_modules/sass/sass.dart.js:5014:15)
      at _wrapJsFunctionForAsync_closure.call$2 (/Users/jason/src/cv/node_modules/sass/sass.dart.js:35702:12)
      at _awaitOnObject_closure.call$1 (/Users/jason/src/cv/node_modules/sass/sass.dart.js:35690:32)
      at Object._rootRunUnary (/Users/jason/src/cv/node_modules/sass/sass.dart.js:5417:18)
      at StaticClosure.<anonymous> (/Users/jason/src/cv/node_modules/sass/sass.dart.js:116011:16)
      at _CustomZone.runUnary$2$2 (/Users/jason/src/cv/node_modules/sass/sass.dart.js:37151:39)
      at _Future__propagateToListeners_handleValueCallback.call$0 (/Users/jason/src/cv/node_modules/sass/sass.dart.js:36216:51)
      at Object._Future__propagateToListeners (/Users/jason/src/cv/node_modules/sass/sass.dart.js:5209:93)

💁 Possible Solution

It makes no sense. I tried debugging it right up to resolve in @parcel/node-resolver-core where it calls resolver.resolveAsync(options) which is the Rust resolver so I can't debug any further. How to debug the Rust resolver?

What is bizare is that both build and serve pass the same options:

{
  "filename": "bootstrap/scss/bootstrap",
  "specifierType": "esm",
  "parent": "/Users/jason/src/cv/src/scss/styles.scss",
  "env": {},
  "sourcePath": "/Users/jason/src/cv/src/scss/styles.scss",
  "packageConditions": [
    "style",
    "sass"
  ]
}

but serve comes back with a result but build does not.

There were some other options somewhere else and one had:

defaultTargetOptions.shouldOptimize = false

and the other had:

defaultTargetOptions.shouldOptimize = true
defaultTargetOptions.shouldScopeHoist = true

Not sure if that is relevant or not.

🔦 Context

I can't build and publish my CV to GitHub pages.

💻 Code Sample

https://github.com/steinybot/cv

🌍 Your Environment

Software Version(s)
Parcel 2.12.0
Node 20.17.0
npm/Yarn npm 10.8.2
Operating System macOS 14.6.1
steinybot commented 2 months ago

Ah for some reason includeNodeModules is false for parcel build but not parcel serve

steinybot commented 2 months ago

This fixes it:

  "targets": {
    "main": {
      "includeNodeModules": {
        "*.scss": true
      }
    }
  }

It'd be really nice if this was easier to discover.