2022 - GULP FOR HTML + SCSS + JS (ES6+)

Steps to copy to your local environment:

1. Download archive or clone these files with:

git clone https://github.com/andreistez/gulp-html.git

2. Install dependencies:

npm i

3. Start development:

npm start

4. Production build:

npm run build

5. You are awesome! Good luck! ;-)

---

Where to place source files?

Nice question! Inside your src directory.

---

Where are processed files located?

Inside your public directory. It will appear after starting development or after running production build.

---

Features:

1. HTML

1.1. Gulp-file-include allows you to divide your HTML layout into small parts, pass your data to them and etc (please see docs).

1.2. If img tag has src with the image that has its WEBP version - image will be replaced with this WEBP.

---

2. Styles

2.1. SCSS support.

2.2. If background-url points to an image that has its WEBP version - it will be replaced.

2.3. If there are different CSS-properties that could be replaced with their short version - they will be replaced automatically.

2.4. All @media queries with the same rules will be grouped together.

2.5. Gulp4 default sourcemaps added.

---

3. JavaScript

3.1. ES6+ with import / export support.

3.2. Gulp4 default sourcemaps added.

---

4. Images

4.1. Minification of PNG, JPG, JPEG, GIF, SVG.

4.2. Also creates WEBP version of the image.

---

5. Errors

Pop-up system notifications are added - now you will not waste your time searching for error.

---