spectatorx
2 months ago

Error while trying to run npm watch, possible incompatibility?

Posted 2 months ago by spectatorx

I'm working now on code i took from github and while i try to run npm watch i'm getting huge error message which i completely do not understand. I've tried to google pieces of these error messages but found answers also do not make much sense. Maybe anyone in here would want to help to understand what am i supposed to do to fix it? Error message:

ERROR in ./resources/sass/app.scss
Module build failed (from ./node_modules/css-loader/index.js):
ModuleBuildError: Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Incompatible units rem and px.
    ╷
729 │ $nav-link-height:                   $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;
    │                                     ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    ╵
  node_modules/bootstrap/scss/_variables.scss 729:37  @import
  node_modules/bootstrap/scss/bootstrap.scss 9:9      @import
  /var/www/html/lvforum/resources/sass/app.scss 9:9                                           root stylesheet
    at /var/www/html/lvforum/node_modules/webpack/lib/NormalModule.js:316:20
    at /var/www/html/lvforum/node_modules/loader-runner/lib/LoaderRunner.js:367:11
    at /var/www/html/lvforum/node_modules/loader-runner/lib/LoaderRunner.js:233:18
    at context.callback (/var/www/html/lvforum/node_modules/loader-runner/lib/LoaderRunner.js:111:13)
    at /var/www/html/lvforum/node_modules/sass-loader/dist/index.js:73:7
    at Function.call (/var/www/html/lvforum/node_modules/sass/sass.dart.js:87203:16)
    at _render_closure1.call (/var/www/html/lvforum/node_modules/sass/sass.dart.js:76994:12)
    at _RootZone.runBinary (/var/www/html/lvforum/node_modules/sass/sass.dart.js:25521:18)
    at _RootZone.runBinary (/var/www/html/lvforum/node_modules/sass/sass.dart.js:25525:19)
    at _FutureListener.handleError (/var/www/html/lvforum/node_modules/sass/sass.dart.js:23975:19)
    at _Future__propagateToListeners_handleError.callLARACASTS_SNIPPET_PLACEHOLDER (/var/www/html/lvforum/node_modules/sass/sass.dart.js:24271:40)
    at Object._Future__propagateToListeners (/var/www/html/lvforum/node_modules/sass/sass.dart.js:3500:88)
    at _Future._completeError (/var/www/html/lvforum/node_modules/sass/sass.dart.js:24099:9)
    at _AsyncAwaitCompleter.completeError (/var/www/html/lvforum/node_modules/sass/sass.dart.js:23491:12)
    at Object._asyncRethrow (/var/www/html/lvforum/node_modules/sass/sass.dart.js:3256:17)
    at /var/www/html/lvforum/node_modules/sass/sass.dart.js:13326:20
    at _wrapJsFunctionForAsync_closure.$protected (/var/www/html/lvforum/node_modules/sass/sass.dart.js:3279:15)
    at _wrapJsFunctionForAsync_closure.call (/var/www/html/lvforum/node_modules/sass/sass.dart.js:23512:12)
    at _awaitOnObject_closure0.call (/var/www/html/lvforum/node_modules/sass/sass.dart.js:23504:25)
    at _RootZone.runBinary (/var/www/html/lvforum/node_modules/sass/sass.dart.js:25521:18)
    at _RootZone.runBinary (/var/www/html/lvforum/node_modules/sass/sass.dart.js:25525:19)
    at _FutureListener.handleError (/var/www/html/lvforum/node_modules/sass/sass.dart.js:23975:19)
    at _Future__propagateToListeners_handleError.callLARACASTS_SNIPPET_PLACEHOLDER (/var/www/html/lvforum/node_modules/sass/sass.dart.js:24271:40)
    at Object._Future__propagateToListeners (/var/www/html/lvforum/node_modules/sass/sass.dart.js:3500:88)
    at _Future._completeError (/var/www/html/lvforum/node_modules/sass/sass.dart.js:24099:9)
    at _AsyncAwaitCompleter.completeError (/var/www/html/lvforum/node_modules/sass/sass.dart.js:23491:12)
    at Object._asyncRethrow (/var/www/html/lvforum/node_modules/sass/sass.dart.js:3256:17)
    at /var/www/html/lvforum/node_modules/sass/sass.dart.js:15981:20
    at _wrapJsFunctionForAsync_closure.$protected (/var/www/html/lvforum/node_modules/sass/sass.dart.js:3279:15)
    at _wrapJsFunctionForAsync_closure.call (/var/www/html/lvforum/node_modules/sass/sass.dart.js:23512:12)
    at _awaitOnObject_closure0.call (/var/www/html/lvforum/node_modules/sass/sass.dart.js:23504:25)
    at _RootZone.runBinary (/var/www/html/lvforum/node_modules/sass/sass.dart.js:25521:18)
    at _RootZone.runBinary (/var/www/html/lvforum/node_modules/sass/sass.dart.js:25525:19)
    at _FutureListener.handleError (/var/www/html/lvforum/node_modules/sass/sass.dart.js:23975:19)
    at _Future__propagateToListeners_handleError.callLARACASTS_SNIPPET_PLACEHOLDER (/var/www/html/lvforum/node_modules/sass/sass.dart.js:24271:40)
    at Object._Future__propagateToListeners (/var/www/html/lvforum/node_modules/sass/sass.dart.js:3500:88)
 @ ./resources/sass/app.scss

ERROR in ./resources/sass/app.scss (./node_modules/css-loader??ref--5-2!./node_modules/postcss-loader/src??postcss0!./node_modules/resolve-url-loader??ref--5-4!./node_modules/sass-loader/dist/cjs.js??ref--5-5!./resources/sass/app.scss)
Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Incompatible units rem and px.
    ╷
729 │ $nav-link-height:                   $font-size-base * $line-height-base + $nav-link-padding-y * 2 !default;
    │                                     ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
    ╵
  node_modules/bootstrap/scss/_variables.scss 729:37  @import
  node_modules/bootstrap/scss/bootstrap.scss 9:9      @import
  /var/www/html/lvforum/resources/sass/app.scss 9:9                                           root stylesheet
 @ ./resources/sass/app.scss 2:14-253

Do i understand correctly there seem to be problems in code in files located in node_modules? This doesn't make sense to me as i even removed that folder and run npm install to install all dependencies again. Sorry if that is obvious to you what is happening in here but i am clueless and that's why i am making this thread.

This is content of my /resources/sass/app.scss (i've removed it from code snippet tags as for some reason this snippet was embedding into error code snippet above, weird):

// Fonts @import url(https://fonts.googleapis.com/css?family=Raleway:300,400,600);

// Variables @import "variables";

// Bootstrap @import '~bootstrap/scss/bootstrap';

// Custom @import "custom";

Please sign in or create an account to participate in this conversation.