- Components: Pages stores within root directory, components for including within
components
folder. Plugins:
Importing components:gulp-file-include
.
Replace<img>
with<picture>
: gulp_img_transform_to_picture (plugin by myself).
Compression:gulp-htmlmin
. - Javascript: Fully processed by
WebPack
+Babel
and its plugins. - Styles:
Support old browsers:
gulp-autoprefixer
.
Grouping media queries:gulp-group-css-media-queries
SASS support + compressing:gulp-sass
+sass
. - Assets:
-
- Fonts: Transforming to
woff2
fromotf
andttf
, creatingfonts.scss
file with@font-face
for fonts automatically.
- Fonts: Transforming to
-
- Images: Transforming to
avif
&webp
usingsharp
.
- Images: Transforming to
Errors handled by gulp-notify
& gulp-plumber
.
Dev server provided by browser-sync
.
For size stats used gulp-size
.
Optional operations available with gulp-if
.
Sourcemaps generated gulp-sourcemaps
.
npm run gulp:start
: Start project without transforming media files and fonts, only copy.npm run gulp:dev
: Start project in development mode, transform media files and fonts, including sourcemaps and not minify.npm run gulp:build
: Build project with maximum optimizations, ready for production.npm run gulp:media
: Transform media files only.npm run gulp:fonts
: Transform fonts only.
If you notice any bug, or you want to suggest an idea, please contact me.
- Telegram: @Blatisgense (best way)
- Discord: blatisgense
- Email: [email protected]