Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ignore file by mask in settings #119

Open
Alexufo opened this issue Apr 1, 2019 · 2 comments
Open

Ignore file by mask in settings #119

Alexufo opened this issue Apr 1, 2019 · 2 comments

Comments

@Alexufo
Copy link

Alexufo commented Apr 1, 2019

I have a folder with images with different names except main.jpg

I want convert main.jpg to 600px and over files to 1000px

 .pipe(responsive({
     '**/*.{jpg,JPG}': {width: 1000 },
     'main.{jpg,JPG}': {width: 600},
 })

But i want ignore main.jpg for 1000px width resizing. And do this

'**/!(main.*)*.{jpg,JPG}': {width: 1000 },

But this rule is not working.

@mwkaicz
Copy link

mwkaicz commented Jul 11, 2019

I had same problem, You can use two tasks and define these rules in gulp.src():

function devImagesResizeMain(){
    return gulp.src( 
        [
            IMG_SRC_DIR + '/**/*.{jpg,jpeg,png,gif,svg}',
            '!' + IMG_SRC_DIR + '/**/header.{jpg,jpeg,png,gif,svg}' 
        ], { allowEmpty: true })
    .pipe(responsive(
        {
            '*.jpg': getImagesResizeRules()
        }
    ))
    .pipe(gulp.dest(DEST_DEV_DIR + DEST_IMG_DIR));
}

function devImagesResizeCust(){
    return gulp.src( IMG_SRC_DIR + '/**/header.{jpg,jpeg,png,gif,svg}', { allowEmpty: true })
    .pipe(responsive(
        {
            'header.jpg':   injectObjectsInArrayByObj( getImagesResizeRules(), {gamma: 3.0} )
        }
    ))
    .pipe(gulp.dest(DEST_DEV_DIR + DEST_IMG_DIR));
}

gulp.task('resize',gulp.series(devImagesResizeMain, devImagesResizeCust, function (done) {
    done();
}));

@Northward-Design
Copy link

Northward-Design commented Feb 11, 2020

  1. This solution works, but it leads to more issues:
return gulp.src( 
    IMG_SRC_DIR + '/**/*.{jpg,jpeg,png,gif,svg}'
)
.pipe(responsive({
     '!main.*': {width: 1000 },
     'main.{jpg,JPG}': {width: 600},
 })

This only works for one image format type (.jpg in this case), as it will grab ALL images excluding 'main.' and format the width to 1000px.

  1. Another solution would be to prefix all images depending on their purpose and do something like this:
.pipe(responsive({
     'other-*.{jpg,JPG}': {width: 1000 },
     'main-*.{jpg,JPG}': {width: 600},
 })

Prefixing could be made less tedious for a large amount of files with gulp-rename.

  1. The Simplest workaround: rename main.jpg to main.jpeg
.pipe(responsive({
     '**/*.{jpg,JPG}': {width: 1000 },
     'main.jpeg': {width: 600},
 })

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants