Basic Gulp Structure 2.0

Use Webpack for scripts
Improve SASS mixins
Improve folder structure

Vue Gulp Structure v1.1.0

App Technologies

On this branch (Vue) we use:

• BEM + BEMIT + etc: A mix of BEM and related-BEM technologies to create conventions for CSS classes.
• TypeScript: This project uses TypeScript instead of JavaScript.
• Vue: The components framework.
• Linting: Linting for TypeScript and SASS.
• Normalize: Normalize our css, you can extend it easily.
• SASS: Scss structure with good practises.

Tasks Technologies

On this branch (Vue) we use:

• 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 Tslint: Linting for TypeScript.
• 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 Sass: Compile Scss to CSS.
• Gulp Sasslint: Linting for SASS.
• Gulp Sourcemaps: Generate Sourcemaps when is necessary (only used with SCSS).
• Gulp Uglify: Minify and obfuscate JavaScript.
• Opn: Open browser to see the preview.
• Require all: Load all gulp tasks once.
• Browserify: To bundle our code.
• Yarn: Instead of NPM.

TypeScript Gulp Structure 1.1.0

Update tslint
Update yarn
Normalize all versions

Node TypeScript Gulp Structure 1.1.0

App Technologies

On this branch (Basic) we use:

• BEM + BEMIT + etc: A mix of BEM and related-BEM technologies to create conventions for CSS classes.
• TypeScript: This project uses TypeScript instead of JavaScript.
• Linting: Linting for JavaScript and SASS.
• Normalize: Normalize our css, you can extend it easily.
• SASS: Scss structure with good practises.

Tasks Technologies

On this branch (Basic) we use:

• Gulp Autoprefixer: Add browser prefixes for last two versions of the browsers.
• Gulp Clean CSS: To minify CSS.
• Gulp Environment: Call to different tasks depending of the environment.
• 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 Nodemon: To launch the NodeJS application.
• 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 TSLint: Linting for TypeScript.
• Gulp Uglify: Minify and obfuscate JavaScript.
• Opn: Open browser to see the preview.
• Require all: Load all gulp tasks once.
• Yarn: Instead of NPM.

Basic Gulp Structure 1.1.0

Fix watcher
Update yarn
Normalize all versions

TypeScript Gulp Structure

App Technologies

• BEM + BEMIT + etc: A mix of BEM and related-BEM technologies to create conventions for CSS classes.
• TypeScript: This project uses TypeScript instead of JavaScript.
• jQuery: Only to show how to import an external library.
• Linting: Linting for TypeScript 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 Tslint: Linting for TypeScript.
• 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 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.
• Gulp TypeScript: To compile TypeScript
• Yarn: Instead of NPM.

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.