Gulp Drupal Stack
OVH Gulp tasks for Drupal themes and modules
Overview:
The Gulp Drupal Stack offers a comprehensive solution for managing front-end tasks in Drupal projects. This powerful set of tools streamlines the development workflow by facilitating SCSS and JS compilation, file watching, and image optimization. With its flexible configuration options, developers can effortlessly set up a customized build process that meets their specific project needs.
By leveraging this stack, teams can enhance their productivity, ensure code quality, and maintain an organized codebase. Whether you're working on a small site or a large enterprise-level application, the Gulp Drupal Stack provides the essential features to help you succeed in your project.
Features:
- SCSS to CSS Compilation: Seamlessly compile SCSS files into CSS using LibSass and PostCSS with built-in linting and SourceMap support.
- JS Compilation: Utilize Babel for modern JavaScript syntax compilation, complete with linting and code aggregation to keep your scripts organized.
- Webpack Module Bundling: Efficiently bundle your JS modules with Webpack, allowing for a cleaner project structure and improved load times.
- SVG Font Icons: Generate SVG icons as font files with the capability to add mixins and classes directly in SCSS, plus a demo page for easy reference.
- Drupal File Watching: Trigger Drush cache clears automatically upon file changes, enhancing workflow efficiency by reducing manual steps.
- File Copying: Easily copy files to designated locations within your project, streamlining asset management.
- Sprite Generator: Create image sprites with Retina Display support, optimizing your image assets for high-resolution displays.
- User-Configurable: All features can be easily customized by updating settings in your project's gulpfile.yml, merging with defaults from gulpfile.default.yml.
- Eslint
ESLint is a linter for JavaScript that analyzes code to detect and report on potential problems and errors, as well as enforce consistent code style and best practices, helping developers to write cleaner, more maintainable code.
- Gulp
Gulp.js is an old but popular site building tool that automates various repetitive development tasks in web development, such as compiling Sass, minifying JavaScript, and optimizing images.
- Stylelint
Stylelint is a modern linter for CSS that helps you avoid errors and enforce consistent styling conventions. It provides rules for detecting errors and warnings, and can be configured to match your specific project's requirements.
- Webpack
Webpack is a popular open-source module bundler for JavaScript applications that bundles and optimizes the code and its dependencies for production-ready deployment. It can also be used to transform other types of assets such as CSS, images, and fonts.