Skip to content

mikehazell/texturepacker-multi-scss

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Multiple SCSS spritesheet exporter for TexturePacker

This exporter was created for TexturePacker to enable multiple, unique named sprite sheets and matching style files to be generated.

Installation

  1. Locate the TexturePacker exporters directory within your filesystem, e.g.

    C:\Program Files (x86)\CodeAndWeb\TexturePacker\bin\exporters

  2. Clone the multi-scss custom exporter into your Texturepacker exporters folder

    git clone git@github.com:Lafinboy/texturepacker-multi-scss.git multi-scss

  3. Restart TexturePacker

Use

  1. Open TexturePacker and create a new spritesheet.
  2. Select Multi-SCSS from the Data Format dropdown.
  3. Give the Data File and Texture File matching, unique names, e.g. button-sprite.scss, button-sprite.png
  4. You can now use the unique name as the base class name, e.g. button-sprite

Why did you create this exporter?

TexturePacker is an awesome piece of software, but it's one failing is that the default CSS exporter uses a static base class named "sprite". This prevents use of multiple spritesheets within a site without manually modifying the output CSS.

A quick search for a solution brought me to texturepacker-multi-css by Robert Wallis. This package enabled multiple CSS spritesheet files to be generated, but did not handle generation of pseudo classes from filenames. I've submitted a pull request to fix that issue.

With a solid base to work from I cloned and switched to SCSS output to support my current development environment.

About

Multiple SCSS spritesheet exporter for TexturePacker

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published