PHPackages creaminternet/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 & Helpers](/categories/utility) 4. / 5. creaminternet/frontools ActiveMagento2-component[Utility & Helpers](/categories/utility) creaminternet/frontools ======================= Set of front-end tools for Magento 2, based on Gulp.js 1.14.1(4mo ago)639.2k—0.6%3MITJavaScript Since Jan 27Pushed 4mo ago1 watchersCompare [ Source](https://github.com/creaminternet/magento2-frontools)[ Packagist](https://packagist.org/packages/creaminternet/frontools)[ RSS](/packages/creaminternet-frontools/feed)WikiDiscussions master Synced 1mo ago READMEChangelog (4)DependenciesVersions (86)Used By (0) [![Packagist](https://camo.githubusercontent.com/aa872ee5949322044ba3c2bec1af24e63ddf8f2ff717f93f6c77e5cb86f8dae4/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f762f637265616d696e7465726e65742f66726f6e746f6f6c732e737667)](https://packagist.org/packages/creaminternet/frontools) [![Packagist](https://camo.githubusercontent.com/a463ce85c28b351428144ead5127d95e1f5474ae369523432b9410d322117e12/68747470733a2f2f696d672e736869656c64732e696f2f7061636b61676973742f64742f637265616d696e7465726e65742f66726f6e746f6f6c732e737667)](https://packagist.org/packages/creaminternet/frontools) Frontools for Magento 2 ======================= [](#frontools-for-magento-2) The official fork of the Snowdog Frontools. Frontools is a set of frontend tools for Magento 2, with SASS compilation, CSS and JS linters, SVG sprite genaration, hot-reloading and more. Requirements ------------ [](#requirements) - Unix-like OS, like Mac OS or Linux - Node.js version 18 or higher [LTS version](https://nodejs.org/en/about/releases/) - Magento 2 project with SASS based theme for example [SASS version of "Blank"](https://github.com/creaminternet/magento2-theme-blank-sass) Installation ------------ [](#installation) 1. Run `composer require creaminternet/frontools` 2. Go to package directory `cd vendor/creaminternet/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) Optional configurations for 3rd party plugins --------------------------------------------- [](#optional-configurations-for-3rd-party-plugins) You will find sample config files for theses plugins in `vendor/creaminternet/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 < 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/creaminternet/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 56 — FairBetter than 98% of packages Maintenance74 Regular maintenance activity Popularity36 Limited adoption so far Community21 Small or concentrated contributor base Maturity79 Established project with proven stability Bus Factor1 Top contributor holds 76.7% 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 ~48 days Recently: every ~647 days Total 75 Last Release 147d ago Major Versions 0.11.4 → 1.0.02016-10-24 ### Community Maintainers ![](https://www.gravatar.com/avatar/4d510b07db64278d05c072aa476c6d4d3da76591ca2a0b8d42dfac26264f9d51?d=identicon)[creaminternet](/maintainers/creaminternet) --- Top Contributors [![Igloczek](https://avatars.githubusercontent.com/u/5119280?v=4)](https://github.com/Igloczek "Igloczek (526 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)")[![edwinbos](https://avatars.githubusercontent.com/u/1267356?v=4)](https://github.com/edwinbos "edwinbos (21 commits)")[![timweprovide](https://avatars.githubusercontent.com/u/67999201?v=4)](https://github.com/timweprovide "timweprovide (15 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)")[![keithbentrup](https://avatars.githubusercontent.com/u/253579?v=4)](https://github.com/keithbentrup "keithbentrup (2 commits)")[![philcook](https://avatars.githubusercontent.com/u/2623518?v=4)](https://github.com/philcook "philcook (2 commits)")[![marvinhuebner](https://avatars.githubusercontent.com/u/13386633?v=4)](https://github.com/marvinhuebner "marvinhuebner (2 commits)")[![kirmorozov](https://avatars.githubusercontent.com/u/1015432?v=4)](https://github.com/kirmorozov "kirmorozov (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)")[![henkvalk](https://avatars.githubusercontent.com/u/8955854?v=4)](https://github.com/henkvalk "henkvalk (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)") ### Embed Badge ![Health badge](/badges/creaminternet-frontools/health.svg) ``` [![Health](https://phpackages.com/badges/creaminternet-frontools/health.svg)](https://phpackages.com/packages/creaminternet-frontools) ``` ### Alternatives [vdb/php-spider A configurable and extensible PHP web spider 1.4k181.0k7](/packages/vdb-php-spider)[igorw/config-service-provider A config ServiceProvider for Silex with support for php, json and yaml. 215636.5k13](/packages/igorw-config-service-provider)[emadadly/laravel-uuid laravel uuid a simple, automatic UUID generator for any model based on Laravel. 120415.9k3](/packages/emadadly-laravel-uuid)[skyronic/laravel-file-generator Laravel package to help you automate creation of files. Build your own custom generators like 'artisan make:model'. 6748.3k](/packages/skyronic-laravel-file-generator)[outl1ne/nova-media-hub A Laravel Nova tool for managing media. 4652.0k](/packages/outl1ne-nova-media-hub)[conquer/select2 Yii2 Select2 widget 1678.0k4](/packages/conquer-select2) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)