geddski / csstyle

MOVED TO https://github.com/csstyle/csstyle a modern approach for crafting beautifully maintainable stylesheets
http://csstyle.io
Other
851 stars 34 forks source link

How to use in Gulp? #49

Open json-uk opened 9 years ago

json-uk commented 9 years ago

I've been unable to get cssstyle working in my gulpfile. Maybe I'm just not using it correctly?

Whenever I run my default task, I get this error:

[22:39:28] TypeError: undefined is not a function
    at Gulp.<anonymous> (/Users/dtigraphics/Git/block-css/gulpfile.js:81:17)
    at module.exports (/Users/dtigraphics/Git/block-css/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:34:7)
    at Gulp.Orchestrator._runTask (/Users/dtigraphics/Git/block-css/node_modules/gulp/node_modules/orchestrator/index.js:273:3)
    at Gulp.Orchestrator._runStep (/Users/dtigraphics/Git/block-css/node_modules/gulp/node_modules/orchestrator/index.js:214:10)
    at /Users/dtigraphics/Git/block-css/node_modules/gulp/node_modules/orchestrator/index.js:279:18
    at finish (/Users/dtigraphics/Git/block-css/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:21:8)
    at /Users/dtigraphics/Git/block-css/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:52:4
    at f (/Users/dtigraphics/Git/block-css/node_modules/gulp/node_modules/orchestrator/node_modules/end-of-stream/node_modules/once/once.js:17:25)
    at DestroyableTransform.onend (/Users/dtigraphics/Git/block-css/node_modules/gulp/node_modules/orchestrator/node_modules/end-of-stream/index.js:31:18)
    at DestroyableTransform.emit (events.js:129:20)

BTW: I'm using gulp-load-plugins to auto load all plugins but even require-ing it manually it still isn't working. In my gulp file I have this:

gulp.task ('css', ['minify:css'], function (){
    processors = [
        p.mixins,
        p.nested,
        p.cssnext({
            features: {
              customProperties: {
                variables: cssVars
              },
              compress: false,
              autoprefixer: { 
                browsers: ['last 2 version', '> 5%'] 
              },
              rem: false,
              colorRgba: false,
              filter: {
                oldIE: false
              }
            }
        }),
        plugins.cssstyle(),
        p.fakeid()

    ];
    return gulp.src(basePaths.src + assetPaths.css + appFiles.css)
        .pipe(plugins.sourcemaps.init())
        .pipe(plugins.postcss(processors))
        .pipe(plugins.pxtorem(pxtoremOptions))
        .pipe(plugins.sourcemaps.write('.'))
        .pipe(gulp.dest(basePaths.dest + assetPaths.css));
});

Any thoughts? Thanks!

geddski commented 9 years ago

Maybe try isolating it to just nested and csstyle plugins and see if it works. It's possible that another plugin is clashing with it.

geddski commented 9 years ago

any luck?

SevereOverfl0w commented 9 years ago

gulp-load-plugins may not work for csstyle as it isn't prefixed (e.g. by postcss-) Also, in your example you are including 3 "s" it should be 2.