JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 28
  • Score
    100M100P100Q41376F
  • License MIT

Your workflow will be easier

Package Exports

  • gulp-query

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (gulp-query) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

gulp-query

Your workflow will be easier

Use only what you need

Why?

  • provides an easy, convenient API for defining basic Gulp tasks for your application
  • plugins for SCSS, PostCSS, JS, Webpack, Rollup, combining styles and js, compressing image, cooking sprite and more
  • A small number of lines of the gulpfile.js
  • Out of the box available ready tasks, watching, separate run tasks, production mode with compression, sourcemap...
  • Minimum settings
  • Install and immediately use
  • Plugins

Example

Install gulp-query and plugins

npm install gulp-query gulp-query-scss gulp-query-webpack gulp-query-compress

gulp-query-scss — to compile SCSS gulp-query-webpack — for bundle with CSS, SCSS

Paste the code into your gulpfile.js and configure it

let build = require('gulp-query')
  , scss = require('gulp-query-scss')
  , compress = require('gulp-query-compress')
  , webpack = require('gulp-query-webpack');

build((query) => {
    // query.plugins([scss, webpack, compress])
    query.plugins(scss, webpack, compress)
      .scss('src/scss/admin.scss','css/undercover.css')
      .scss('src/scss/app.scss','css/','app')
      .webpack('src/js/app.js','js/','app')
      .compress('src/icons/*.png','images/')
      ;
});

And feel the freedom

gulp
gulp --production // For production (minification)
gulp watch // Watching change
gulp scss // Only for scss
gulp scss:app // Only for app.scss
gulp webpack:app watch // Watching change only for app.js nad app/**/*.js
gulp webpack --production // Production only for webpack
gulp webpack scss
gulp webpack:app compress
...

Your results in a clear table

alt text

Easy, right?

  • Install the plugins that we use
  • Compile the Sass file, ./src/scss/app.sass to ./css/app.css and ./src/scss/admin.sass to ./css/undercover.css
  • Bundle all JavaScript (and any required modules) at ./src/js/app.js to ./js/app.js
  • Compress images at ./src/icons/*.png to images/
  • We can run each task separately

And it's just several lines of code. In contrast to the original...

Plugins

All plugins for gulp-query