PHPackages                             spiritgr/frontools - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility &amp; Helpers](/categories/utility)
4. /
5. spiritgr/frontools

ActiveMagento2-component[Utility &amp; Helpers](/categories/utility)

spiritgr/frontools
==================

Set of front-end tools for Magento 2, based on Gulp.js

1.11.3(5y ago)012[1 PRs](https://github.com/spiritdigitalagency/magento2-frontools/pulls)MITJavaScript

Since Jan 27Pushed 2y agoCompare

[ Source](https://github.com/spiritdigitalagency/magento2-frontools)[ Packagist](https://packagist.org/packages/spiritgr/frontools)[ RSS](/packages/spiritgr-frontools/feed)WikiDiscussions master Synced 1mo ago

READMEChangelog (3)DependenciesVersions (92)Used By (0)

[![Packagist](https://camo.githubusercontent.com/563e354c30fad771dfa982a129ab1893c53bb6569f0bae48cc1da24df38e98a9/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f736e6f77646f672f66726f6e746f6f6c732e737667)](https://packagist.org/packages/snowdog/frontools) [![Packagist](https://camo.githubusercontent.com/c5090710e395020dcac4c24ca9714ad38732a849548b69d4710883b881d78b60/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f736e6f77646f672f66726f6e746f6f6c732e737667)](https://packagist.org/packages/snowdog/frontools)

Magento 2 Frontools
===================

[](#magento-2-frontools)

Set of front-end tools for Magento 2

Requirements
------------

[](#requirements)

- Unix-like OS (please, do not ask about Windows support)
- Node.js [LTS version](https://nodejs.org/en/about/releases/). We recommend using [Volta](https://volta.sh/).
- Magento 2 project with SASS based theme for example [SASS version of "Blank"](https://github.com/SnowdogApps/magento2-theme-blank-sass) or [Alpaca Theme](https://github.com/SnowdogApps/magento2-alpaca-theme)

Installation
------------

[](#installation)

1. Run `composer require snowdog/frontools`
2. Go to package directory `cd vendor/snowdog/frontools`
3. Run `yarn` or `npm install`
4. Decide where you want to keep your config files. You can store them in Frontools `config` directory or in `dev/tools/frontools/config` (recommended). There is a `setup` task to copy all sample config files from the `config` to `dev/tools/frontools/config` and create a convenient symlink `tools` in the project root. If you want to keep config files inside frontools `config` dir, you have to handle this manually.
5. Define your themes in `themes.json`.

`themes.json` structure
-----------------------

[](#themesjson-structure)

Check `config/themes.json.sample` to get samples.

- `src` - full path to theme
- `dest` - full path to `pub/static/[theme_area]/[theme_vendor]/[theme_name]`
- `locale` - array of available locales
- `parent` - name of parent theme
- `stylesDir` - (default `styles`) path to styles directory. For `theme-blank-sass` it's `styles`. By default Magento 2 use `web/css`.
- `disableSuffix` - disable adding `.min` suffix using `--prod` flag.
- `postcss` - (default `["autoprefixer({ overrideBrowserslist: browserslist })"]`) PostCSS plugins config. Have to be an array.
- `modules` - list of modules witch you want to map inside your theme
- `ignore` - array of ignore patterns

`watcher.json` structure
------------------------

[](#watcherjson-structure)

Check `config/watcher.json.sample` to get samples.

- `usePolling` - set this to `true` to successfully watch files over a network (i.e. Docker or Vagrant) or when your watcher dosen't work well. Warning, enabling this option may lead to high CPU utilization! [chokidar docs](https://github.com/paulmillr/chokidar#performance)

`sass-compiler.json` structure
------------------------------

[](#sass-compilerjson-structure)

You can choose Sass compiler between the default, but [already deprecated](https://github.com/sass/node-sass/issues/2952), `node-sass` or a newer and faster `dart-sass`.

Since the Dart Sass does not have the same set of features as Node Sass, for now we will keep the older version as default.

Optional configurations for 3rd party plugins
---------------------------------------------

[](#optional-configurations-for-3rd-party-plugins)

You will find sample config files for theses plugins in `vendor/snowdog/frontools/config` directory.

- Create [browserSync](https://www.browsersync.io/) configuration
- Create [eslint](https://eslint.org/) configuration
- Create [sass-lint](https://github.com/sasstools/sass-lint) configuration
- Create [stylelint](https://github.com/stylelint/stylelint) configuration
- Create [svg-sprite](https://github.com/jkphl/gulp-svg-sprite) configuration

Tasks list
----------

[](#tasks-list)

Use `yarn [taskName]` or `npm run [taskName]` to run the task.

- `babel` - Run [Babel](https://babeljs.io/), a compiler for writing next generation JavaScript.
    - `--theme name` - Process single theme.
    - `--prod` - Production output - minifies and uglyfy code.
- `clean` - Removes `/pub/static` directory content.
- `csslint` - Run [stylelint](https://github.com/stylelint/stylelint) based tests.
    - `--theme name` - Process single theme.
    - `--ci` - Enable throwing errors. Useful in CI/CD pipelines.
- `dev` - Runs [browserSync](https://www.browsersync.io/) and `inheritance`, `babel`, `styles`, `watch` tasks.
    - `--theme name` - Process single theme.
    - `--disableLinting` - Disable JS, SASS, CSS linting.
    - `--disableMaps` - Disable inline source maps generation.
- `emailfix` - Fixes email stylesheet for Magento &lt; 2.3.0. [Related issue](https://github.com/MyIntervals/emogrifier/issues/296)
    - `--prod` - Production output - minifies styles and add `.min` sufix.
- `eslint` - Run [eslint](https://eslint.org/) against all JS files.
    - `--theme name` - Process single theme.
    - `--fix` - Autofix errors
    - `--ci` - Enable throwing errors. Useful in CI/CD pipelines.
- `inheritance` - Create necessary symlinks to resolve theme styles inheritance and make the base for styles processing. You have to run in before styles compilation and after adding new files.
- `magepackBundle` - Run [magepack](https://github.com/magesuite/magepack) `bundle` command.
    - `-c` or `--config` - (required) Path to previously generated Magepack config file.
    - `--theme name` - Process single theme.
- `magepackGenerate` - Run [magepack](https://github.com/magesuite/magepack) `generate` command.
    - `--cms-url` - (required) URL to one of CMS pages (e.g. homepage).
    - `--category-url` - (required) URL to one of category pages.
    - `--product-url` - (required) URL to one of product pages.
    - `-u` or `--auth-username` - Username for Basic Auth.
    - `-p` or `--auth-password` - Passoword for Basic Auth.
    - `-d` or `--debug` - Turn on debugging mode.
- `sasslint` - Run [sass-lint](https://github.com/sasstools/sass-lint) based tests.
    - `--theme name` - Process single theme.
    - `--ci` - Enable throwing errors. Useful in CI/CD pipelines.
- `setup` - Creates a convenient symlink from `/tools` to `/vendor/snowdog/frontools` and copies all sample files if no configuration exists.
    - `--symlink name` - If you don't want to use `tools` as the symlink you can specify another name.
- `styles` - Use this task to manually trigger styles processing pipeline.
    - `--theme name` - Process single theme.
    - `--disableMaps` - Disable inline source maps generation.
    - `--prod` - Production output - minifies styles and add `.min` suffix.
    - `--ci` - Enable throwing errors. Useful in CI/CD pipelines.
- `svg` - Run [svg-sprite](https://github.com/jkphl/gulp-svg-sprite) to generate SVG sprite.
    - `--theme name` - Process single theme.
- `watch` - Watch for style changes and run processing tasks.
    - `--theme name` - Process single theme.
    - `--disableLinting` - Disable JS, SASS, CSS linting.
    - `--disableMaps` - Disable inline source maps generation.

###  Health Score

33

—

LowBetter than 75% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity5

Limited adoption so far

Community17

Small or concentrated contributor base

Maturity79

Established project with proven stability

 Bus Factor1

Top contributor holds 78.2% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~20 days

Recently: every ~8 days

Total

86

Last Release

1978d ago

Major Versions

0.11.4 → 1.0.02016-10-24

### Community

Maintainers

![](https://www.gravatar.com/avatar/929ef35579cff889c1d6a16db6b23a7adc80e1bb70217bcec3cbe737be99b736?d=identicon)[spiritdigitalagency](/maintainers/spiritdigitalagency)

---

Top Contributors

[![Igloczek](https://avatars.githubusercontent.com/u/5119280?v=4)](https://github.com/Igloczek "Igloczek (523 commits)")[![greenkeeper[bot]](https://avatars.githubusercontent.com/in/505?v=4)](https://github.com/greenkeeper[bot] "greenkeeper[bot] (49 commits)")[![greenkeeperio-bot](https://avatars.githubusercontent.com/u/14790466?v=4)](https://github.com/greenkeeperio-bot "greenkeeperio-bot (48 commits)")[![timweprovide](https://avatars.githubusercontent.com/u/67999201?v=4)](https://github.com/timweprovide "timweprovide (15 commits)")[![vpsnak](https://avatars.githubusercontent.com/u/1353263?v=4)](https://github.com/vpsnak "vpsnak (8 commits)")[![snyk-bot](https://avatars.githubusercontent.com/u/19733683?v=4)](https://github.com/snyk-bot "snyk-bot (5 commits)")[![talalus](https://avatars.githubusercontent.com/u/3689740?v=4)](https://github.com/talalus "talalus (3 commits)")[![philcook](https://avatars.githubusercontent.com/u/2623518?v=4)](https://github.com/philcook "philcook (2 commits)")[![kirmorozov](https://avatars.githubusercontent.com/u/1015432?v=4)](https://github.com/kirmorozov "kirmorozov (2 commits)")[![marvinhuebner](https://avatars.githubusercontent.com/u/13386633?v=4)](https://github.com/marvinhuebner "marvinhuebner (2 commits)")[![keithbentrup](https://avatars.githubusercontent.com/u/253579?v=4)](https://github.com/keithbentrup "keithbentrup (2 commits)")[![youanden](https://avatars.githubusercontent.com/u/183880?v=4)](https://github.com/youanden "youanden (1 commits)")[![fsw](https://avatars.githubusercontent.com/u/784083?v=4)](https://github.com/fsw "fsw (1 commits)")[![GrimLink](https://avatars.githubusercontent.com/u/4387541?v=4)](https://github.com/GrimLink "GrimLink (1 commits)")[![kruchy8](https://avatars.githubusercontent.com/u/12099511?v=4)](https://github.com/kruchy8 "kruchy8 (1 commits)")[![matthewhaworth](https://avatars.githubusercontent.com/u/920191?v=4)](https://github.com/matthewhaworth "matthewhaworth (1 commits)")[![melvyn-sopacua](https://avatars.githubusercontent.com/u/3591955?v=4)](https://github.com/melvyn-sopacua "melvyn-sopacua (1 commits)")[![powelles](https://avatars.githubusercontent.com/u/9540779?v=4)](https://github.com/powelles "powelles (1 commits)")[![slackerzz](https://avatars.githubusercontent.com/u/3061752?v=4)](https://github.com/slackerzz "slackerzz (1 commits)")[![timneutkens](https://avatars.githubusercontent.com/u/6324199?v=4)](https://github.com/timneutkens "timneutkens (1 commits)")

### Embed Badge

![Health badge](/badges/spiritgr-frontools/health.svg)

```
[![Health](https://phpackages.com/badges/spiritgr-frontools/health.svg)](https://phpackages.com/packages/spiritgr-frontools)
```

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)
