search

jjlharrison / gulp-rtlcss

Gulp plugin that uses RTLCSS to convert LTR CSS to RTL.
MIT License
36 stars 7 forks source link

Error when using with gulp-sourcemaps. #9

Closed tjdunklee closed 6 years ago

tjdunklee commented 7 years ago

First of all, thank you for the very helpful module!!! I'm using it to automate my RTL CSS but ran into a problem when I am trying to make sourcemaps (using Gulp-Sourcemaps). Here is my Gulp task I am trying to use:

gulp.task('sass', function() {  
  return gulp  
  .src(assetPath + 'scss/**/*.scss')  
  .pipe(sourcemaps.init({loadMaps: true}))  
  .pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))  
  .pipe(autoprefixer(autoprefixerOptions))  
  .pipe(sourcemaps.write('.'))  
  .pipe(gulp.dest(assetPath + 'stylesheets'))  
  .pipe(rtlcss())  
  .pipe(rename({ suffix: '-rtl' }))  
  .pipe(gulp.dest(assetPath + 'stylesheets'));  
});

Here is the error I receive:

C:\Projects\vagrant-local\www\fibre-one\htdocs\node_modules\postcss\lib\lazy-result.js:247
        if (this.error) throw this.error;
                        ^
CssSyntaxError: <css input>:1:783: Missed semicolon
    at Input.error (C:\Projects\vagrant-local\www\fibre-one\htdocs\node_modules\postcss\lib\input.js:113:22)
    at Parser.checkMissedSemicolon (C:\Projects\vagrant-local\www\fibre-one\htdocs\node_modules\postcss\lib\parser.js:495:26)
    at Parser.decl (C:\Projects\vagrant-local\www\fibre-one\htdocs\node_modules\postcss\lib\parser.js:270:50)
    at Parser.other (C:\Projects\vagrant-local\www\fibre-one\htdocs\node_modules\postcss\lib\parser.js:170:18)
    at Parser.loop (C:\Projects\vagrant-local\www\fibre-one\htdocs\node_modules\postcss\lib\parser.js:81:26)
    at parse (C:\Projects\vagrant-local\www\fibre-one\htdocs\node_modules\postcss\lib\parse.js:26:16)
    at new LazyResult (C:\Projects\vagrant-local\www\fibre-one\htdocs\node_modules\postcss\lib\lazy-result.js:70:24)
    at Processor.process (C:\Projects\vagrant-local\www\fibre-one\htdocs\node_modules\postcss\lib\processor.js:117:12)
    at DestroyableTransform._transform (C:\Projects\vagrant-local\www\fibre-one\htdocs\node_modules\gulp-rtlcss\index.js:24:65)
    at DestroyableTransform.Transform._read (C:\Projects\vagrant-local\www\fibre-one\htdocs\node_modules\gulp-rtlcss\node_modules\readable-stream\lib\_stream_transform.js:184:10)

Any ideas what could be causing this? Do I need to change the order of my Gulp task?

maximivanov commented 7 years ago

In your example rtlcss gets both css and map files as input and it fails on non-css. I had the same problem and I just used gulp-if to filter css files. Like

  ...
  .pipe(gulp.dest(assetPath + 'stylesheets'))  
  .pipe(gulpIf('*.css', rtlcss()))
  .pipe(gulpIf('*.css', rename({suffix: '-rtl'})))
  .pipe(gulpIf('*.css', gulp.dest(assetPath + 'stylesheets')));

Probably lazypipe can be used to wrap all 3 rtl-related steps with single gulp-if.

tjdunklee commented 7 years ago

Thank you for taking the time to suggest a fix @maximivanov! I'm going to implement it next week and I'll update on here if it worked.

jjlharrison commented 6 years ago

Source map support will be added in 1.1.0. I'm planning on deploying this version today.

kovart commented 4 years ago

Hi guys, It looks like it fails with the source map again. I have the same error now and it resolves by disabling the source maps.

jjlharrison commented 4 years ago

@kovart: Can you post the gulpfile snippet that is failing?