SASS: Can't find stylesheet to import (node_module)

parcel src/index.html and parcel serve src/index.html work fine with my App.scss file:

$theme-colors: (
	"primary": #8AFFA3,
);

@import "bootstrap/scss/bootstrap";

But then when I try to build for production using parcel build src/index.html i get this error:

> parcel build src/index.html

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

Here is my index.html

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	<link rel="stylesheet" href="./App.scss">
</head>
<body>
	<div id="root"></div>

	<script src="./index.tsx"></script>
</body>
</html>

_Originally posted by @Ethan-Arrowood in https://github.com/parcel-bundler/parcel/issues/3377#issuecomment-627095775_

Issue Analytics

State:
Created 3 years ago
Comments:10 (2 by maintainers)

Top GitHub Comments

2reactions

Ethan-Arrowoodcommented, May 12, 2020

I was using npm. I was able to fix it by changing the path to @import "node_modules/bootstrap/scss/bootstrap";

1reaction

tillsanderscommented, Apr 2, 2022

I have a similar issue. I was using the npm: syntax inside my SASS files like this:

@import "npm:@picocss/pico/scss/variables";

This worked with parcel src/index.pug, but not with parcel build src/index.pug. It did work, however, once I removed the main-property from my package.json which was set to index.js:

{
  "name": "my-package",
  "main": "index.js"
}

Parcel thought I was trying to build a library, but I was actually building a simple web page. I’m not sure what the connection is to my import statement, though.

Top Results From Across the Web

Sass "Error: Can't find stylesheet to import." - Stack Overflow

It seems like this is a path issue; _functions.scss is in the same directory as bootstrap.scss in node_modules/bootstrap/scss , but it seems ...

Error: Can't find stylesheet to import. · Issue #3269 - GitHub

ParcelJS solved my problem by being able to compile my Sass/Scss code into ... Error: Can't find stylesheet to import. ... Nodejs 8.11.0...

Executing Sass - Can't find stylesheet to import - Syncfusion

Hi :) I'm currently trying to do the following: code.png. So I import the base styles, then I override some scss variables, and...

Sass Error after upgrading vom v14 to v15 | Infragistics Forums

src/styles.scss - Error: Module build failed (from ./node_modules/sass-loader/dist/cjs.js): SassError: Can't find stylesheet to import.

Sass: @import

Sass extends CSS's @import rule with the ability to import Sass and CSS stylesheets, providing access to mixins, functions, and variables and combining ......