[react-scripts 3.4.0] SCSS file with import statement cause resolve-url-loader: CSS error
Created by: simoneb
Describe the bug
After upgrading from react-scripts 3.2.0 to 3.4.0 in a project which imports a simple SCSS file with an @import statement, running yarn build
consistently fails with:
$ react-scripts build
Creating an optimized production build...
Failed to compile.
./src/index.scss
Error: resolve-url-loader: CSS error
Invalid mapping: {"generated":{"line":1,"column":63},"source":"file:///home/circleci/project/src/index.scss","original":{"column":null},"name":null}
Steps to reproduce
Here's a very simple repro created by:
npx create-react-app
yarn add node-sass
- create a
index.scss
file containing@import url("https://fonts.googleapis.com/css?family=Open+Sans");
- import
index.scss
fromApp.js
Links
- Repro url: https://github.com/simoneb/cra-3.4.0-sass-repro
- CircleCI build showing the build error: https://app.circleci.com/jobs/github/simoneb/cra-3.4.0-sass-repro/1