Possibilities

Code Quality

• Pre-commit hook with husky and lint-staged.

  Note
  husky uses .lintstagedrc.json.

• Checking files with editorconfig-checker and editorconfig.

  Note
  editorconfig-checker and .prettierrc use .editorconfig file.
  For editorconfig, there is an ignore .ecrc file.

• Checking *.js files with eslint.

  Note
  ESlint has no rules for formatting, Prettier does it.

• Checking *.scss files with stylelint.

  Note
  Stylelint has no rules for formatting, Prettier does it.

• Checking *.md files with remark.

• Checking BEM class naming using gulp-html-bem-validator.

  Note
  The report is output to the console.

• HTML validation with gulp-w3c-html-validator.

  Note
  The report is output to the console.

• Check accessibility with gulp-wcag-accessibility.

  Note
  For more information, read about the site-builder Architecture.

• Error notifications with gulp-plumber and gulp-notify.

HTML/PUG

• Remove comments and redundant attributes values with gulp-htmlmin.

• Adding a version to a css and js file connection using gulp-version-number.

  Note
  For more information, read about the site-builder Architecture.

• You can use data from .json files for pug loops.

  Note
  You can read about how to do this here.

SCSS/CSS

• Minify and compress css with gulp-clean-css, two files will be created, one for developers and one for production.

• Ordering css properties with gulp-csscomb and .csscomb.json.

• Compresses all media queries into one using gulp-group-css-media-queries.

• Automatic addition of vendor prefixes for css properties with autoprefixer.

  Note
  autoprefixer uses .browserslistrc.

JS/TS

• Compress and minimize *.js files with terser-webpack-plugin, two files will be created, one for developers and one for production.

Images

• Image optimization with gulp-imagemin.

• Creating an svg sprite with gulp-svg-sprite and svgo.

  Note
  gulp-svg-sprite uses svgo.config.js.

• Creating .webp images with gulp-webp, gulp-webp-html-nosvg, gulp-webpcss and webp-converter.

Fonts

• Convert fonts .otf to .ttf with gulp-fonter-fix. Convert fonts .ttf to .woff2 with gulp-ttf2woff2. Also fonts.js will create a font-face.scss file in which there will be font connections.

  Important
  If you have removed or added a font file, then delete the font-face.scss file and run the fonts task.

  Note
  The font-face.scss file is located in scss/base/.

Other Possibilities

• Sending the dist/ folder to the gh-pages branch, using the gh-pages plugin.

• Compress the dist/ folder into an .zip archive, the archive will take the name of the root directory.

  Note
  For more information, read about the site-builder Architecture.

• To bring the code to a single formatting, use .gitattributes.

• To install the latest recommended version of node.js use .nvmrc.

• To configure node.js use .npmrc.

Working With a PUG

Working With a SCSS

Working With a JS