0

In our Laravel 5.1 app, we are using elixir and gulp to compile css from sass. When we run just gulp, everything compiles correctly and the css files are up to date. Yet, when we run gulp watch, and we update a .scss file, Gulp says Sass Compiled successfully, but the css files do not have the newest change. What are we doing wrong?

  • added gulpfile.js contents:

    var gulp = require('gulp');
var elixir = require('laravel-elixir');

elixir(function(mix){


    mix.copy("vendor/kwizer15/jquery/jquery.js",     "resources/assets/js/jquery.js")
    .copy("vendor/kwizer15/jquery-ui/dist/jquery-ui.js",     "resources/assets/js/jquery-ui.js")
    .copy("vendor/kwizer15/jquery-ui/dist/jquery-ui.css",     "resources/assets/css/jquery-ui.css")
    .copy("vendor/kwizer15/jquery-ui/dist/images/**", "public/images/")
    .copy("vendor/kwizer15/highcharts/highcharts.js",     "resources/assets/js/highcharts.js")
    .copy("vendor/fortawesome/font-awesome/css/font-awesome.css",     "resources/assets/css/font-awesome.css")
    .copy("vendor/fortawesome/font-awesome/fonts/**",     "public/build/fonts/")
    .copy("vendor/twbs/bootstrap/dist/css/bootstrap.css",     "resources/assets/css/bootstrap.css")
    .copy("vendor/twbs/bootstrap/dist/js/bootstrap.js", "resources/assets/js/bootstrap.js")
    .copy("vendor/twbs/bootstrap/dist/fonts/**", "public/assets/fonts/")
    .copy("vendor/rjacobsen/jquery-nestable/src/jquery.nestable.css",     "public/css/jquery.nestable.css")
    .copy("vendor/rjacobsen/jquery-nestable/src/jquery.nestable.js",     "public/js/jquery.nestable.js")
    .copy("bower_components/mjolnic-bootstrap-colorpicker/dist/css/**",     "public/css/")
    .copy("bower_components/mjolnic-bootstrap-colorpicker/dist/img/**",     "public/images/")
    .copy("bower_components/mjolnic-bootstrap-colorpicker/dist/js/**",     "public/js/")
    .scripts(
        [
            'jquery.js',
            'jquery-ui.js',
            'bootstrap.js',
            'highcharts.js'
        ]
    )
    .styles(
        [
            'font-awesome.css',
            'bootstrap.css',
            'jquery-ui.css',
            'custom/nav_styles.css'
        ]
    )
    .phpUnit()
    .version(["css/all.css", "js/all.js"]);

mix.sass(['reseller_settings.scss'],     'public/css/reseller_settings.css');
mix.sass(['menu_builder.scss'], 'public/css/menu_builder.css');
mix.sass(['nav_menu.scss'], 'public/css/nav_menu.css');

    

});
user1013129
  • 123
  • 1
  • 4
  • 11
  • 1
    You'll want to post the contents of your grunt file. I'd suspect you've incorrectly configured your css output for the `watch` task. – fontophilic Aug 10 '15 at 20:15

1 Answers1

0

I had the same problem. But I moved the files into the same directory as the main file

Before: resources/assets/custom

After: resources/assets/sass/custom

Fernando Dias
  • 1