Failed to find 'functions scss error in angular application

Question

I have created a brand new angular 7 application and installed it with scss. After building the application I am getting the following error

My style.scss class has the following import

@import '../node_modules/bootstrap/scss/bootstrap.scss';

I can also see a functions files under bootstrap folder of node_modules

ERROR in ./src/styles.css (./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plugins/raw-css-loader.js!./node_modules/postcss-loader/src??embedded!./src/styles.css) Module build failed (from ./node_modules/postcss-loader/src/index.js): Error: Failed to find 'functions' in [C:\Development\360-manager\src\WebUI2_0\manager-ui\node_modules\bootstrap\scss] at resolveModule.catch.catch (C:\Development\360-manager\src\WebUI2_0\manager-ui\node_modules\postcss-import\lib\resolve-id.js:35:13)

@import "../node_modules/bootstrap/scss/bootstrap"; try something like this — TheParam
– TheParam, Commented Feb 13, 2019 at 8:11
i tried that and still get error ERROR in ./src/styles.css (./node_modules/@angular-devkit/build-angular/src/angular-cli-files/plugins/raw-css-loader.js!./node_modules/postcss-loader/src??embedded!./src/styles.css) Module build failed (from ./node_modules/postcss-loader/src/index.js): Error: Failed to find '../node_modules/bootstrap/scss/bootstrap' in [ C:\Development\360-manager\src\WebUI2_0\manager-ui\src ] at resolveModule.catch.catch (C:\Development\360-manager\src\WebUI2_0\manager-ui\node_modules\postcss-import\lib\resolve-id.js:35:13) — Tom
– Tom, Commented Feb 13, 2019 at 9:26
I have exactly the same problem now and I'm trying to solve it. BTW .. try with something like @import "~bootstrap/scss/bootstrap.scss" — Georgi
– Georgi, Commented Feb 13, 2019 at 12:26

Ramin eghbalian · Accepted Answer · 2022-05-23 00:21:58Z

2

Use @import "~bootstrap/scss/bootstrap".
See: https://webpack.js.org/loaders/sass-loader

Control @import URL resolves the given URL in the runtime. To import styles from a node_modules path prefix it with a ~. So @import "~bootstrap/scss/bootstrap" imports everything from the folder: node_modules/bootstrap/scss/bootstrap

edited May 23, 2022 at 0:21

Ramin eghbalian

2,6851 gold badge22 silver badges38 bronze badges

answered Apr 10, 2019 at 15:18

szarghani

1636 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

NiAu Over a year ago

Still gives me an error Failed to find 'bootstrap/scss/bootstrap' in my Angular 7.2 project. Bootstrap version is 4.4.1

Anand Rockzz · Accepted Answer · 2019-05-20 14:35:39Z

1

Got this error when my project was configured to use css. Consider changing it to scss first. How to can be found here

answered May 20, 2019 at 14:35

Anand Rockzz

6,7285 gold badges73 silver badges83 bronze badges

Collectives™ on Stack Overflow

Failed to find 'functions scss error in angular application

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related