D
D
dicem2019-06-10 20:48:51
Less
dicem, 2019-06-10 20:48:51

Why are variables lost in less when building in gulp?

Hello, I recently set up a gulpfile for building less layout, put all the variables into a separate less file, I import this file into General.less with all styles, however, when building through gulp-less, the output is an empty css file, and gulp complains that that we are using non-created variables.

gulpfile

const gulp			= require('gulp'),
    concat		= require('gulp-concat-css'),
    cleanCSS		= require('gulp-clean-css'),
    less			= require('gulp-less'),
    autoprefixer 	= require('gulp-autoprefixer'),
    path			= require('path')

gulp.task('less', done => {
  gulp.src('./src/**/*.less')
    .pipe( less({
      paths: [ path.join(__dirname, 'less', 'includes') ]
    }))
    //.pipe( concat('General.css'))
    .pipe( autoprefixer({
      browsers: ['last 2 version'],
      cascade: false
    }))
    .pipe( cleanCSS({ level: 2 }))
    .pipe( gulp.dest('./build/style/'))
  done()
})

gulp.task('assets', done => {
  gulp.src('./assets/css/**/*.css')
    .pipe( concat('Assets.css'))
    .pipe( cleanCSS({ level: 2 }))
    .pipe( gulp.dest('./build/style/'))
  done()
})

gulp.task('default', gulp.parallel(
  'assets',
  'less'
))

gulp.watch('./src/**/*.less', gulp.series('less'))


I understand that most likely you need to first concatenate all less files with a file with variables, but I don’t need to combine everything into one file, I need to leave the number of files as they are.
Maybe there is some setting in gulp-less or another compiler, please help!

Answer the question

In order to leave comments, you need to log in

2 answer(s)
D
dicem, 2019-08-01
@dicem

And actually, because you NEED to concatenate less first and only then compile, use gulp-concat.

D
Dima Polos, 2019-06-10
@dimovich85

Firstly, you don’t need to concatenate less, and secondly: check the paths to the files, apparently there are errors, or if your concatenation was immediately in the assembly, then maybe it ate variables? The concat is called css-concat, it could skip variables, and then the loess compiler does not see them.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question