Cannot create property 'importer' on string 'scss/bootstrap.scss'

Viewed 263

During Parcel compilation, this error occurs:

Cannot create property 'importer' on string 'scss/bootstrap.scss'

My app.css file:

@import '../node_modules/bootstrap/scss/bootstrap.scss';
@import './styles/style.scss';
@import './styles/plugins/plugins.scss';
@import './styles/plugins/plugins.css';
@import './styles/loader.scss';
@import './styles/custom.css';

Why is Parcel not recognizing the correct bootstrap SCSS?

1 Answers

It looks like this a bug in parcel caused by the the way that @parcel/transformer-sass goes looking for configuration files that might be located in your project. One of the sources of configuration is the sass field in package.json (see code). For some reason, bootstrap's package.json has "sass": "scss/bootstrap.scss" (see code), which isn't the format parcel is expecting, so it chokes.

I found a workaround while we work on a fix - if the type of the file that contains the @import '../node_modules/bootstrap/scss/bootstrap.scss'; line is .scss instead of .css, it should work.

Related