包简介

Is a simple image to sprite compiler tool for web development.

README 文档

README

Is a simple image to sprite compiler tool for web development.

Features

Supports png, gif, jpg, bmp and webp icons.
Automatically generate css class for each icon.
Easy integration with any web projects.

Installation

You can install via composer.

composer require jameslevi/sprite --dev

Copy the atmos file from vendor/jameslevi/atmos folder to your root directory.
Create a new folder in your root directory named commands.

Getting Started

Create a new atmos command file named "sprite".

php atmos --make sprite

Open the Sprite.php file from commands folder and add a new protected method named "generate".

/**
 * Method to generate sprite image and stylesheet.
 *
 * @param  array $arguments
 * @return void
 */

protected function generate(array $arguments)
{
     
}

Try the following code inside the generate method.

// Create new instance by setting sprite name and asset location.
$sprite = new Sprite("test", __DIR__ . "/../resources/icons");

// Set where to save the generated sprite image.
$sprite->setGeneratedImagePath(__DIR__ . "/../public/img");
$sprite->setImageBaseURL("/../img");

// Set where to save the generated css file.
$sprite->setGeneratedCSSPath(__DIR__ . "/../public/css");

$sprite->generate();

Run the following command in your terminal to generate sprite.

php atmos sprite:generate

Add the generated css file in the head section of your project.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/sprite-test.css">
</head> 
<body>
  
</body>
</html>

You can access each icon using css classes in this pattern sprite-{sprite name}-{icon name}.

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="css/sprite-test.css">
</head> 
<body>
 
    <div class="sprite-test sprite-test-icon1"></div>
    <div class="sprite-test sprite-test-icon2"></div>
    <div class="sprite-test sprite-test-icon3"></div>
 
</body>
</html>

If there is a need to add new icons into your icon set, just run the generate command and it will generate new sprite image and stylesheet again.

Best Practices

In each sprite set, always make sure all icons are of the same type and dimensions.
Do not add spaces in naming icons, instead use hypen to separate words.
Do not place your assets folder in public directory.

Contribution

For bug reports and suggestions, you can email James Levi Crisostomo via nerdlabenterprise@gmail.com.

License

This package is an open-sourced software licensed under MIT License.

jameslevi/sprite 适用场景与选型建议

jameslevi/sprite 是一款基于 PHP 开发的 Composer 扩展包，目前已累计 22 次下载、GitHub Stars 达 2，最近一次更新时间为 2021 年 03 月 24 日，在 PHP 生态内属于活跃度较高的组件。

它主要适用于以下技术方向：「icons」「sprite」等业务场景。在实际项目中，围绕这些方向常见需要落地的问题包括：接口对接、性能调优、并发安全、与既有框架（Laravel / ThinkPHP / Yii / Webman 等）的兼容适配，以及生产环境的日志埋点与稳定性保障。

我们在过去多个企业项目中使用过 jameslevi/sprite 或与其功能相近的方案，如果你在选型或落地过程中遇到问题，例如 版本兼容、二次改造、私有化封装、与内部系统对接、生产 BUG 排查，欢迎联系我们协助评估。

围绕 jameslevi/sprite 我们能提供哪些服务？

定制开发 / 二次开发

基于 jameslevi/sprite 在你已有业务上做功能扩展、字段裁剪、UI 适配、与内部账号 / 权限 / 日志系统的深度对接。

BUG 修复 & 性能优化

线上偶发问题、内存泄漏、慢查询、并发异常等排查修复；针对高流量场景做缓存、队列、索引层面的调优。

项目外包 & 长期维护

承接完整的项目从需求 → 设计 → 开发 → 上线 → 长期运维；也可按月提供技术保姆服务。

yvsm@zunyunkeji.com QQ：316430983 微信：yvsm316 西安尊云信息科技 · 专注 PHP / Go / 分布式系统研发

与 jameslevi/sprite 相关的其它包

同方向 / 同关键字的高下载量 PHP Composer 包推荐，方便对比选型：

nfq-alpha/sprite-bundle 0

Generate sprites with PHP and twig templates

atelierspierrot/famfamfam-silk-sprite 2

The UNOFFICIAL sprite of the Silk icons by FamFamFam (http://www.famfamfam.com/lab/icons/silk/)

jkphl/iconizr 486

A PHP command line tool for converting SVG images to a set of CSS icons (SVG & PNG, single icons and / or CSS sprites) with support for image optimization and Sass output

innoweb/silverstripe-page-icons 3

A simple library of SVG page type icons for enhancing your SilverStripe CMS interface.

emgag/video-thumbnail-sprite 26

PHP library for generating video thumbnail sprites

daljo25/filament-tabler-icons 5

A Filament plugin that integrates tabler icons, allowing you to use them seamlessly across Filament forms, tables, actions, and more.

jameslevi/sprite

包简介

关键字：