Basic Gulp Structure

App Technologies

• BEM + BEMIT + etc: A mix of BEM and related-BEM technologies to create conventions for CSS classes.
• EcmaScript2015: All the code uses this version of ES, also gulp files.
• jQuery: Only to show how to import an external library.
• Linting: Linting for JavaScript and SASS.
• Normalize: Normalize our css, you can extend it easily.
• SASS: Scss structure with good practises.

Tasks Technologies

• Gulp Autoprefixer: Add browser prefixes for last two versions of the browsers.
• Gulp Clean CSS: To minify CSS.
• Gulp Connect: Preview website on local server.
• Gulp Environment: Call to different tasks depending of the environment.
• Gulp Eslint: Linting for JavaScript.
• Gulp Fontmin: Generate fonts from .ttf.
• Gulp Imagemin: Compress images.
• Gulp Load plugins: Load all the plugins once.
• Gulp Newer: On some tasks we want to do something only with the newer files.
• Gulp Noop: Basic Noop but on stream.
• Gulp Rollup: To transpile out code.
• Gulp Sass: Compile Scss to CSS.
• Gulp Sasslint: Linting for SASS.
• Gulp Sourcemaps: Generate Sourcemaps when is necessary.
• Gulp Uglify: Minify and obfuscate JavaScript.
• Opn: Open browser to see the preview.
• Require all: Load all gulp tasks once.
• Rollup Babel: To use Babel with Rollup (ES2015 -> ES5).
• Require CommonJS: Uses CommonJS for modules.
• Require Inject: Include external dependencies to our code.
• Require Node Resolve: Uses node resolution for path names.
• Yarn: Instead of NPM.