GithubHelp home page GithubHelp logo

Generate retina only about webpack-spritesmith HOT 2 CLOSED

mixtur avatar mixtur commented on September 1, 2024
Generate retina only

from webpack-spritesmith.

Comments (2)

mixtur avatar mixtur commented on September 1, 2024

I think your best shot is customTemplates + setup for no retina + retina images.
it should be something like

new SpritesmithPlugin({
    target: {
        css: [
            [path.resolve(__dirname, 'src/spritesmith-generated/sprite-2.css'), {
                format: 'retinaOnly'
            }]
        ]
    },
    customTemplates: {
        retinaOnly: require.resolve('spritesheet-templates/lib/templates/sass_retina.template.handlebars')
        // or whatever else here https://github.com/twolfson/spritesheet-templates/tree/master/lib/templates
    }
});

Though it probably will not work. Because spritesheet-templates are using original image sizes. And by my suggestion you only provide doubled / retina flavoured images.

But solution is somewhere around there )) You can take template above and modify it in such way that it will divide sizes and sprite positions by 2 when necessary.

I can't dig deeper into it right now. But I will in a few days.

from webpack-spritesmith.

km-tr avatar km-tr commented on September 1, 2024

Thank you!
After modifying it went well.

from webpack-spritesmith.

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.