Search code examples
csslaravelnpmsassnpm-run

How to change value appcss in laravel


I want to change background color in laravel page. Based on reference that i get. i should make a change in _variables.scss.

// Body
$body-bg: #f8fafc; --> i change it to #000

// Typography
$font-family-sans-serif: "Nunito", sans-serif;
$font-size-base: 0.9rem;
$line-height-base: 1.6;
........

In views file, i put code:

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>ICan</title>
    <link rel="stylesheet" href="/css/app.css"> --> i enter this one
  </head>
  <body>
    @yield('content')
    @include('inc.sidebar')
  </body>
</html>

And then i do npm run serve in cmd But nothing happen in my page. The background color doesn't change. Did i do something wrong?

Please help me. Thank you :))


Solution

  • You arent doing anything wrong, simply missing a step. Before serving the application, do this:

    npm run dev
    

    This will compile all of your scss files into your app.css file

    however if you dont want to run this command every time you make a change in your scss file's, run the following:

    npm run watch
    

    This will watch for changes and run the compilation when a change occurs!