'Node Error: resolve-url-loader: CSS error
I am trying to run a react project as dev server on my surface, and if gives me the error shown below and in the title. When I am running the same config on my pc I am not having this problem. (I tried creating the same conditions, but it just wont work).
Error:
./src/assets/scss/black-dashboard-pro-react.scss?v=1.0.0 (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-5-1!./node_modules/postcss-loader/src??postcss!./node_modules/resolve-url-loader??ref--6-oneOf-5-3!./node_modules/sass-loader/lib/loader.js??ref--6-oneOf-5-4!./src/assets/scss/black-dashboard-pro-react.scss?v=1.0.0)
Error: resolve-url-loader: CSS error
source-map information is not available at url() declaration (found orphan CR, try removeCR option)
Complete error from Browser Console: (Chrome)
Fetch API cannot load file:///C:/Users/Max-T/Documents/Sources/StaffMangerV2/Oauth2Manager-Web/src/assets/scss/black-dashboard-pro-react.scss. URL scheme must be "http" or "https" for CORS request.
(anonymous) @ index.js:1679
s @ index.js:499
(anonymous) @ index.js:479
e.<computed> @ index.js:536
S @ index.js:1517
i @ index.js:1534
(anonymous) @ index.js:1541
(anonymous) @ index.js:1530
(anonymous) @ index.js:1699
(anonymous) @ index.js:1673
s @ index.js:499
(anonymous) @ index.js:479
e.<computed> @ index.js:536
S @ index.js:1517
i @ index.js:1534
(anonymous) @ index.js:1541
(anonymous) @ index.js:1530
q @ index.js:1726
I @ index.js:1658
G @ index.js:1817
(anonymous) @ index.js:1831
(anonymous) @ index.js:1848
(anonymous) @ index.js:1332
error (async)
u @ index.js:1334
K @ index.js:1847
ce @ index.js:1951
./node_modules/react-dev-utils/webpackHotDevClient.js @ webpackHotDevClient.js:38
__webpack_require__ @ bootstrap:785
fn @ bootstrap:150
0 @ store.js:18
__webpack_require__ @ bootstrap:785
checkDeferredModules @ bootstrap:45
webpackJsonpCallback @ bootstrap:32
(anonymous) @ main.chunk.js:1
index.js:1679 Fetch API cannot load file:///C:/Users/Max-T/Documents/Sources/StaffMangerV2/Oauth2Manager-Web/node_modules/resolve-url-loader/index.js. URL scheme must be "http" or "https" for CORS request.
(anonymous) @ index.js:1679
s @ index.js:499
(anonymous) @ index.js:479
e.<computed> @ index.js:536
S @ index.js:1517
i @ index.js:1534
(anonymous) @ index.js:1541
(anonymous) @ index.js:1530
(anonymous) @ index.js:1699
(anonymous) @ index.js:1673
s @ index.js:499
(anonymous) @ index.js:479
e.<computed> @ index.js:536
S @ index.js:1517
i @ index.js:1534
(anonymous) @ index.js:1541
(anonymous) @ index.js:1530
q @ index.js:1726
I @ index.js:1658
G @ index.js:1817
(anonymous) @ index.js:1831
(anonymous) @ index.js:1848
(anonymous) @ index.js:1332
error (async)
u @ index.js:1334
K @ index.js:1847
ce @ index.js:1951
./node_modules/react-dev-utils/webpackHotDevClient.js @ webpackHotDevClient.js:38
__webpack_require__ @ bootstrap:785
fn @ bootstrap:150
0 @ store.js:18
__webpack_require__ @ bootstrap:785
checkDeferredModules @ bootstrap:45
webpackJsonpCallback @ bootstrap:32
(anonymous) @ main.chunk.js:1
main.chunk.js:10 Uncaught Error: Module build failed (from ./node_modules/resolve-url-loader/index.js):
Error: resolve-url-loader: CSS error
source-map information is not available at url() declaration (found orphan CR, try removeCR option)
at file://C:\Users\Max-T\Documents\Sources\StaffMangerV2\Oauth2Manager-Web\src\assets\scss\black-dashboard-pro-react.scss:13239:3
at encodeError (C:\Users\Max-T\Documents\Sources\StaffMangerV2\Oauth2Manager-Web\node_modules\resolve-url-loader\index.js:219:12)
at onFailure (C:\Users\Max-T\Documents\Sources\StaffMangerV2\Oauth2Manager-Web\node_modules\resolve-url-loader\index.js:176:14)
at Object../node_modules/css-loader/dist/cjs.js?!./node_modules/postcss-loader/src/index.js?!./node_modules/resolve-url-loader/index.js?!./node_modules/sass-loader/lib/loader.js?!./src/assets/scss/black-dashboard-pro-react.scss?v=1.0.0 (http://localhost:3000/static/js/main.chunk.js:10:7)
at __webpack_require__ (http://localhost:3000/static/js/bundle.js:786:30)
at fn (http://localhost:3000/static/js/bundle.js:151:20)
at Object../src/assets/scss/black-dashboard-pro-react.scss?v=1.0.0 (http://localhost:3000/static/js/main.chunk.js:744:15)
at __webpack_require__ (http://localhost:3000/static/js/bundle.js:786:30)
at fn (http://localhost:3000/static/js/bundle.js:151:20)
at Module../src/index.js (http://localhost:3000/static/js/main.chunk.js:9220:109)
at __webpack_require__ (http://localhost:3000/static/js/bundle.js:786:30)
at fn (http://localhost:3000/static/js/bundle.js:151:20)
at Object.0 (http://localhost:3000/static/js/main.chunk.js:9988:18)
at __webpack_require__ (http://localhost:3000/static/js/bundle.js:786:30)
at checkDeferredModules (http://localhost:3000/static/js/bundle.js:46:23)
at Array.webpackJsonpCallback [as push] (http://localhost:3000/static/js/bundle.js:33:19)
at http://localhost:3000/static/js/main.chunk.js:1:85
./node_modules/css-loader/dist/cjs.js?!./node_modules/postcss-loader/src/index.js?!./node_modules/resolve-url-loader/index.js?!./node_modules/sass-loader/lib/loader.js?!./src/assets/scss/black-dashboard-pro-react.scss?v=1.0.0 @ main.chunk.js:10
__webpack_require__ @ bootstrap:785
fn @ bootstrap:150
./src/assets/scss/black-dashboard-pro-react.scss?v=1.0.0 @ black-dashboard-pro-react.scss?v=1.0.0:1
__webpack_require__ @ bootstrap:785
fn @ bootstrap:150
./src/index.js @ index.css?e32c:37
__webpack_require__ @ bootstrap:785
fn @ bootstrap:150
0 @ store.js:18
__webpack_require__ @ bootstrap:785
checkDeferredModules @ bootstrap:45
webpackJsonpCallback @ bootstrap:32
(anonymous) @ main.chunk.js:1
index.js:1375 ./src/assets/scss/black-dashboard-pro-react.scss?v=1.0.0 (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-5-1!./node_modules/postcss-loader/src??postcss!./node_modules/resolve-url-loader??ref--6-oneOf-5-3!./node_modules/sass-loader/lib/loader.js??ref--6-oneOf-5-4!./src/assets/scss/black-dashboard-pro-react.scss?v=1.0.0)
Error: resolve-url-loader: CSS error
source-map information is not available at url() declaration (found orphan CR, try removeCR option)
Solution 1:[1]
I had this same error. To fix this, I had to navigate to
node_modules/resolve-url-loader
open
index.js
and under var options
change removeCR
from "false" to "true".
Solution 2:[2]
Another option would be to configure the IDE or Editor for the End of Line Sequence type, change from CRLF to LF ... They are only alternatives ... try it.
Solution 3:[3]
well, the solution must be related to some package configuration or something. But I want to share the solution that I applied:
@import "variables";
@import "colored-balls";
@import "glowing-ball";
@import "pixel-loader";
@import "square-box";
@import "circle-loader";
@import "jumping-dots-loader";
Look for the file that cannot be resolved by the module in charge (Look for the error file). with ctrl + click ... and comment one by one until you see which of them you did not read, when you found them: you can, comment on them, Or delete them. They are preloaders, I did not need them.
/* @import "colored-balls"; */
/* @import "pixel-loader"; */
Solution 4:[4]
Checkout git repo with :
[core]
autocrlf = false
Because Windows CRLF are not supported by resolve-url-loader, using node-sass but Options not available to setup with Create-React-App. See https://github.com/sass/node-sass/issues/2756
Solution 5:[5]
In my case, I have recently updated Node.js to latest version & the dependencies for the some of the projects were not rebuilt. So, I deleted existing dependencies & rebuilt them freshly. Then the error was gone.
rm -rf node_modules
npm install
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|---|
Solution 1 | Mudassir |
Solution 2 | TonyInuma |
Solution 3 | AAEM |
Solution 4 | François Breton |
Solution 5 | Tamil Vendhan Kanagarasu |