Update npm deps

.npmrc

@@ -0,0 +1 @@
+engine-strict=true

changelog.md

@@ -1,5 +1,11 @@
 # Changelog
 
+## 3.0.3 (2020-05-28)
+
+- Fixed gulp script (cssnano)
+- Seperated scss tasks
+- minor structure update
+
 ## 3.0.2 (2020-05-04)
 
 - Updated npm dependencies

gulpfile.js

@@ -1,9 +1,10 @@
-'use strict'
+'use strict';
 
-//----------------
+//------------------------
 //:: Initiate npm-modules
+
 const   gulp            = require('gulp'),
-        sass            = require('gulp-sass'),
+        sass            = require('gulp-sass')(require('sass')),
         concat          = require('gulp-concat'),
         livereload      = require('gulp-livereload'),
         notify          = require('gulp-notify'),
@@ -15,8 +16,10 @@ const   gulp            = require('gulp'),
         merge2          = require('merge2'),
         rimraf          = require('rimraf');
 
-//----------------
-//:: configs
+
+//------------------------
+//:: Config parameter
+
 var Config = {
     inputDir: '_source/',
     outputDir: '_dist/'
@@ -30,22 +33,18 @@ var SassConfig = {
     }
 }
 
-var postcss_plugins = [
-    cssnano,
-    autoprefixer
-];
 
-//----------------
+//------------------------
 //:: Tasks
 
 // compile scss
-function scss() {
+function scss_addons() {
     var onError = function(err) {
         notify.onError({
-            title:    'gulp',
-            subtitle: 'Error!',
-            message:  '❌  <%= error.message %>',
-            sound:    'Submarine'
+            "title":      "scss_addons",
+            "subtitle":   "Error!",
+            "message":    "❌  <%= error.message %>",
+            "sound":      "Submarine"
         })(err);
     this.emit('end');
     };
@@ -55,40 +54,62 @@ function scss() {
             'node_modules/sanitize.css/sanitize.css'
     ]))
     .pipe(concat('addons.css'))
+    .pipe(postcss([autoprefixer()]))
     .pipe(gulp.dest(SassConfig.outputDir))
-    .pipe(postcss(postcss_plugins))
-    .pipe(rename({suffix: '.min'}))
-    .pipe(gulp.dest(SassConfig.outputDir)),
-
-    gulp.src(SassConfig.inputDir + '*.scss')
-    .pipe(concat('styles.css'))
-    .pipe(plumber({errorHandler: onError}))
-    .pipe(postcss(postcss_plugins))
-    .pipe(sass(SassConfig.options).on('error', sass.logError))
-    .pipe(gulp.dest(SassConfig.outputDir))
+    .pipe(postcss([cssnano()]))
     .pipe(rename({suffix: '.min'}))
     .pipe(gulp.dest(SassConfig.outputDir))
     .pipe(livereload())
     .pipe(notify({
-        title:      'gulp',
-        subtitle:   'Success!',
-        message:    '✅  SCSS compiled',
-        timeout:    '2'
+        "title":      "scss_addons",
+        "subtitle":   "Success!",
+        "message":    "✅  SCSS compiled",
+        "timeout":    "2"
+    }));
+}
+
+function scss_main() {
+    var onError = function(err) {
+        notify.onError({
+            "title":      "scss_main",
+            "subtitle":   "Error!",
+            "message":    "❌  <%= error.message %>",
+            "sound":      "Submarine"
+        })(err);
+    this.emit('end');
+    };
+
+    return gulp
+    .src(SassConfig.inputDir + '*.scss')
+    .pipe(concat('styles.css'))
+    .pipe(plumber({errorHandler: onError}))
+    .pipe(sass(SassConfig.options).on('error', sass.logError))
+    .pipe(postcss([autoprefixer()]))
+    .pipe(gulp.dest(SassConfig.outputDir))
+    .pipe(postcss([cssnano()]))
+    .pipe(rename({suffix: '.min'}))
+    .pipe(gulp.dest(SassConfig.outputDir))
+    .pipe(livereload())
+    .pipe(notify({
+        "title":      "scss_main",
+        "subtitle":   "Success!",
+        "message":    "✅  SCSS compiled",
+        "timeout":    "2"
     }));
 };
 
 // Copy those other files
 function copy(done) {
-    gulp.src([Config.inputDir + '*.*'])
+    gulp.src([Config.inputDir + '**/*.*'])
         .pipe(gulp.dest(Config.outputDir))
         .pipe(livereload())
     done();
 };
 
-// watch for changes
+// Watch for changes
 function watch() {
     livereload.listen();
-    gulp.watch(SassConfig.inputDir + '*.scss', scss);
+    gulp.watch(SassConfig.inputDir + '*.scss', scss_main);
     gulp.watch(Config.inputDir + '*.html', copy);
 };
 
@@ -97,14 +118,16 @@ function cleanup(cb) {
     return rimraf(Config.outputDir + '*', cb)
 };
 
-//----------------
-//:: Export tasks
+
+//------------------------
+//:: Define tasks
 
 // complex tasks
-const build = gulp.series(cleanup, gulp.parallel(copy, scss));
+const build = gulp.series(cleanup, gulp.parallel(copy, scss_addons, scss_main));
 
 // export tasks
-exports.scss = scss;
+exports.scss_main = scss_main;
+exports.scss_addons = scss_addons;
 exports.copy = copy;
 exports.watch = watch;
 exports.cleanup = cleanup;

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "website_template",
 	"description": "npm & gulp development template",
-	"version": "3.0.2",
+	"version": "3.2.0",
 	"author": "Jan Jastrow",
 	"license": "MIT",
 	"homepage": "https://jan.jastrow.me",
@@ -16,20 +16,21 @@
 		"url": "https://gitea.schwerkraftlabor.de/jan/website_template"
 	},
 	"devDependencies": {
-		"autoprefixer": "^9.7.6",
-		"caniuse-lite": "^1.0.30001050",
-		"cssnano": "^4.1.10",
+		"sass": "^1.49.7",
 		"gulp": "^4.0.2",
+		"gulp-sass": "^5.1.0",
 		"gulp-concat": "^2.6.1",
 		"gulp-livereload": "^4.0.2",
-		"gulp-notify": "^3.2.0",
+		"gulp-notify": "^4.0.0",
 		"gulp-plumber": "^1.2.1",
-		"gulp-postcss": "^8.0.0",
+		"gulp-postcss": "^9.0.1",
 		"gulp-rename": "^2.0.0",
-		"gulp-sass": "^4.1.0",
-		"merge2": "^1.3.0",
+		"merge2": "^1.4.1",
 		"rimraf": "^3.0.2",
-		"sanitize.css": "^11.0.0"
+		"sanitize.css": "^13.0.0",
+		"autoprefixer": "^10.4.2",
+		"caniuse-lite": "^1.0.30001312",
+		"cssnano": "^5.0.17"
 	},
 	"browserslist": [
 		"last 2 version",