Skip to content
Miro Olma edited this page Oct 20, 2017 · 1 revision

Build

/Resources/Build

Gulp Task Overview

JavaScripts

  • Linting with ESLint rules.
  • Converting browser-compatible Javascript with Babel.
  • Uglifyed
  • Minifyed
  • Copy to Resources/Public folder
  • Sync Delete function

Styles

  • Linting with Stylelint rules
  • Automaticstyle formatting with stylefmt. It's a tool that automatically formats CSS according to stylelint rules.
  • Converting SASS to CSS
  • Cleaning Styles
  • Autoprefixer
  • Adding Sourcemapp
  • Minifyed
  • Sync delete function
  • Copy to Resources/Public folder

Images

  • Imagemin JPG
  • Imagemin SVG
  • Imagemin PNG
  • Imagemin GIF
  • Copy to Resources/Public folder
  • Sync delete function

CKEditor

  • Plugin: Wordcount (with dependency: Notification)
  • Copy to Resources/Public/CKEditor folder
  • Sync delete function

Fonts

  • Bootstrap fonts
  • Copy to Resources/Public/Fonts folder
  • Sync delete function

Misc

  • Just a Copy and Paste folder for anything that has no place to be
  • Copy to Resources/Public/Misc folder
  • Sync delete function

Structure overview

Build   |
	  	- Assets | following getting synced to Resources/Public
	  	         | 	
	  	 		 - CKEditor
	  	 		 - Fonts
	  	 		 - Images
	  	 		 - Javascript
	  	 		 - Misc
	  	 		 - Scss 
	  	 		 
     	- Gulp   | Main Gulp Task 
     		   	 |
      			 - task:ckeditor
     			 - task:clean
     			 - task:fonts
     			 - task:images
     			 - task:misc
     			 - task:scripts
     			 - task:styles

Features

Modernizer

It is possible to generate a custom Modernizr JavaScript file.

In package.json its possible to activate the Gulp-Task in "config -> modernizr -> active".

Set active to true and define the wanted features in the "addFeatures" object. Dont forget to link the generated file from Resources/Public/JavaScript/ folder in your Typoscript.

"modernizr": {
  "active": false,
  "settings": {
    "quiet": true,
    "cssPrefix": "",
    "addFeatures": [
      "css/opacity",
      "es6/promises"
    ]
  }
}
Clone this wiki locally