jaydenseric / Barebones

A barebones boilerplate for getting started on a bespoke front end.
125 stars 6 forks source link

Why did concat move #14

Closed RickCogley closed 8 years ago

RickCogley commented 8 years ago

Hi @jaydenseric. I was following along your commits, updating my files and noticed you moved the concat in the css task in the gulp file. What was the reason if I may? --Rick

https://github.com/jaydenseric/Barebones/commit/fa19ded07024d67b78af51442f05f16a5e89632e#diff-b9e12334e9eafd8341a6107dd98510c9R50

jaydenseric commented 8 years ago

There are a few different kinds of errors and warnings that can happen with this CSS task and that seems to be the only way to get error traces to properly reference the source files. I found this to be really tricky. It's not very helpful to always see "Error on line 1 of bundle.css" when you make a typo somewhere in a component's styles. Even where the .on('error', handle) is positioned is significant.

RickCogley commented 8 years ago

Yes, it's location sensitive for sure. When I used it in the position you had it in newly, since I am loading basscss and setting color variables in a file in the /components folder, those variables produced a lot of errors and my bundle was only partially built.

When I switched the concat back to where it was, all is well. Well, at least it compiles and stuff somehow works. I need to understand what it's doing more, I think, to be able to make a better decision about where that needs to go.

This is what's working for me, for now:

gulp.task('css', function () {
  return gulp
    .src(globs.css)
    .pipe(sourcemaps.init())
    .pipe(concat('bundle.css'))
    .pipe(postcss([
      atImport(),
      mqpacker(),
      cssnext({
        autoprefixer: {
          browsers: ['IE >= 9']
        }
      }),
      cssnano(),
      reporter({ clearMessages: true })
    ]))
    .on('error', handle)
    .pipe(sourcemaps.write('.'))
    .pipe(gulp.dest('bundle'))
    .pipe(gulp.dest('../static/bundle'))
})