CSS error source-map information is not available at URL() declaration (found orphan CR, try removeCR option)

Question

I am having a problem when I execute NPM start in my project. I get this error message:

./src/assets/base.scss (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-5-1!./node_modules/postcss-loader/src??postcss!./node_modules/react-scripts/node_modules/resolve-url-loader??ref--6-oneOf-5-3!./node_modules/sass-loader/dist/cjs.js??ref--6-oneOf-5-4!./src/assets/base.scss)
Error: resolve-url-loader: CSS error
  source-map information is not available at url() declaration (found orphan CR, try removeCR option)

Answer 1

There can be multiple reasons for this problem, I will give 3 possible solutions please try all of them

1. try updating the index.js present in node_modules\resolve-url-loader. So here under the var options

var options = Object.assign({
      sourceMap: loader.sourceMap,
      engine: 'postcss',
      silent: false,
      absolute: false,
      keepQuery: false,
      **
      removeCR: false-- > make this "true" ** ,
      root: false,
      debug: false,
      join: joinFn.defaultJoin
    }

then restart your app

2. Next solution is to change end of line sequence to LF See screenshot below to know how it is done in VS Code

3. Check Your CSS files by commenting them one by one and running your code to find the file with the bug. Check all import statements and also the web links in your CSS file.

P.S. This is my first answer so please go easy on me :p for more reference to what I wrote you can also visit this link -> For more details you can also refer this link

Answer 2

Open the file *.css and select end of line sequense to LF (in my case I have change from CRLF to LF) in IDE.