Type
magento2-component
Set of front-end tools for Magento 2, based on Gulp.js
magento2-component
MIT
None
None
None
None
None
None
Set of front-end tools for Magento 2, based on Gulp.js
If you have any questions about this project let's go to offical Magento forum - Less to Sass Community Project
LESS support was droped in version 1.0.0. Fell free to use older version (0.11.4 and lower) or create fork and customize newer versions to fit your needs.
Up from version 1.0.0 we are supporting both Node.js packages managers. We are using npm-shrinkwrap.json
and yarn.lock
to keep modules in safe versions all the time.
.node-version
file.npm install -g gulp-cli
or yarn global add gulp-cli
composer require snowdog/frontools
/vendor/snowdog/frontools
npm install
or yarn
config
dir or /dev/tools/frontools/config
.
There is a gulp setup
task to copy all sample config files from the config
to /dev/tools/frontools/config
and create a convenient symlink in project root.
If you want to keep config files inside frontools config
dir, you have to handle this manually.themes.json
themes.json
structureFirst of all check config/themes.json.sample
- src
- full path to theme
- dest
- full path to pub/static/[theme_area]/[theme_vendor]/[theme_name]
- parent
- name of parent theme
- locale
- array of available locales
- localeOverwrites
- set to true
only if your theme have per locale customizations
- lang
- define styles lang want to use for processing, should be same as files extension. Out of the box Frontools supports only scss
- postcss
- (optional) PostCSS plugins config - have to be an array
browser-sync
- run browserSync- do not run this task separately, it's just a part of dev
taskclean
- Removes /pub/static
folderdefault
- type gulp
to see this readme in consoledeploy
- Resolve theme inheritance of static assets (i.e. fonts, images) symlinking them to pub
dir.
--theme name
- Deploy single theme--prod
- Copy files instead of making symlinksdev
- Runs browser-sync
, inheritance
and watch
tasks
--theme name
- Process single theme--maps
- Toggles source maps generation--prod
- Production output - minifies styleseslint
- Watch and run eslint on specified JS file
--file fileName
- You have to specify what file you want to lint, fileName without .jsrelease
- Clean pub/static
, deploy all necessary files and compiles everything with --prod
flag. Makes code production ready.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 namestyles
- Use this task to manually trigger styles processing pipeline
--theme name
- Process single theme--maps
- Toggles source maps generation--prod
- Production output - minifies styleswatch
- Watch for style changes and run processing tasks
--theme name
- Process single theme--maps
- Enable inline source maps generation--prod
- Production output - minifies stylescsslint
- Run stylelint based tests
--theme name
- Process single theme--ci - Enable throwing errors, useful in CI/CD pipelines
sasslint
- Run sass-lint based tests
--theme name
- Process single theme--ci - Enable throwing errors, useful in CI/CD pipelines
inheritance
- Create necessary symlinks to resolve theme styles inheritance and make base for styles processing. You have to run in before sytles compilation and after adding new files.