Git Product home page Git Product logo

Comments (12)

unlight avatar unlight commented on June 21, 2024

@gilbarbara Sorry, but I cannot reproduce your case.

This file is parsed without errors.

Can you provide more details about your case?

from gulp-cssimport.

gilbarbara avatar gilbarbara commented on June 21, 2024

Hey!
this is the troubling file:
app/styles/main.scss

// bower:css
@import '../../bower_components/pickadate/lib/themes/default.css';
@import '../../bower_components/pickadate/lib/themes/default.date.css';
@import '../../bower_components/pickadate/lib/themes/default.time.css';
// endbower

@import '../../node_modules/c3/c3.css';

This is my gulp task:

return gulp.src('app/styles/main.scss')
  .pipe($.sass.sync({
      includePaths: ['bower_components/'],
      precision: 10
  }).on('error', $.sass.logError))
  .pipe($.autoprefixer({
      browsers: AUTOPREFIXER_BROWSERS
  }))
  .pipe($.cssimport({ matchPattern: '*.css' }))
  .pipe(gulp.dest('.tmp/styles'));

I've tried to pipe the already parsed .css straight to gulp-cssimport and it didn't work anyway.

from gulp-cssimport.

unlight avatar unlight commented on June 21, 2024

That is minimatch problem for some reason pattern *.css does not match for ../../x.css paths.
You need pass minimatch options matchBase: true to plugin options:
E.g.

var options = {
    matchPattern: '*.css',
    matchOptions: {
        matchBase: true
    }
};

stream = gulp.src("style.css")
   .pipe($.cssimport(options))

from gulp-cssimport.

unlight avatar unlight commented on June 21, 2024

I made option matchBase: true by default. It make sense.

from gulp-cssimport.

gilbarbara avatar gilbarbara commented on June 21, 2024

hey, I'm trying with the new matchBase option.
It does parse the .css files however it's messing with the dest path

return gulp.src('app/styles/main.scss')
    .pipe($.plumber())
    .pipe($.sass.sync({
        includePaths: ['bower_components/'],
        precision: 10
    }).on('error', $.sass.logError))
    .pipe($.plumber.stop())
    .pipe($.autoprefixer({
        browsers: AUTOPREFIXER_BROWSERS
    }))
    .pipe($.debug())
//gulp-debug: app/styles/main.css
    .pipe($.cssimport({
        matchPattern: '*.css',
        matchOptions: {
            matchBase: true
        }
    }))
    .pipe($.debug())
//gulp-debug: app/styles/main.css
    .pipe(gulp.dest('.tmp/styles'))
    .pipe($.debug())
//gulp-debug: ../../app/styles/main.css

The last path should be .tmp/styles/main.css instead of ../../app/styles/main.css

Any ideas?

from gulp-cssimport.

unlight avatar unlight commented on June 21, 2024

No ideas.
Run task with $.debug() and with --verbose option ans show the result.

from gulp-cssimport.

gilbarbara avatar gilbarbara commented on June 21, 2024

I got an error in $.debug using --verbose after gulp-cssimport parses the first file and it's unable to finish.
something related to date 😁

gulp-debug: 1 items
gulp-debug: 
cwd:   ~/sai
base:  ~/sai/node_modules/c3
path:  ~/sai/app/styles/main.css

node_modules/gulp-debug/node_modules/stringify-object/index.js:42
    return "new Date('" + val.toISOString() + "')";

RangeError: Invalid time value

from gulp-cssimport.

unlight avatar unlight commented on June 21, 2024

Well, replace in node_modules\gulp-debug\index.js stringifyObject() by JSON.stringify(), and try again.

from gulp-cssimport.

gilbarbara avatar gilbarbara commented on June 21, 2024

hey,
I can't spent more time with this issue today, I'll keep using version 1.x for now. I'll try again later.

thanks

from gulp-cssimport.

unlight avatar unlight commented on June 21, 2024

I have rewritten part with resolving paths, which leads to bogus destination paths.
Please, try new version npm i unlight/gulp-cssimport#3.0, it is not published yet @ npm.

from gulp-cssimport.

unlight avatar unlight commented on June 21, 2024

FIxed in 3.0+

from gulp-cssimport.

gilbarbara avatar gilbarbara commented on June 21, 2024

Sweet, I'll try it tomorrow!
Thanks

from gulp-cssimport.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.