adding #2

.gitignore

@@ -108,6 +108,9 @@ out
 # Stores VSCode versions used for testing VSCode extensions
 .vscode-test
 
+# Laravel Mix
+mix-manifest.json
+
 # yarn v2
 .yarn/cache
 .yarn/unplugged

README.md

@@ -20,6 +20,8 @@ DIRECTUS_API_URL=
 DIRECTUS_API_TOKEN=
 ```
 
+## Laravel Mix 
+
 ## Repositories
 
 For getting Data use **App\\Respositories\\RepositoryAbstract** to create Repository-Classes.

app/Functions/Blade.php

@@ -42,7 +42,7 @@ function asset($path, $prefix = '/public')
 }
 
 /**
- *  getting name of view as slug 
+ *  getting name of view as slug
  *
  *  @param  array $page
  *  @return string
@@ -53,3 +53,23 @@ function viewName(array $page)
     $slugify = new \Cocur\Slugify\Slugify();
     return $slugify->slugify($page['data']['view']);
 }
+
+/**
+ *  getting name of view as slug
+ *
+ *  @param  array $page
+ *  @return string
+ *
+ */
+function canonical()
+{
+    if (isset($_SERVER['HTTPS'])) {
+        $canoncial = 'https';
+    } else {
+        $canoncial = 'http';
+    }
+
+    $canoncial .= '://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];
+
+    return $canoncial;
+}

package.json

@@ -0,0 +1,11 @@
+{
+    "private": true,
+    "devDependencies": {
+        "cross-env": "^7.0.3",
+        "laravel-mix": "^6.0.34",
+        "laravel-mix-purgecss": "^6.0.0",
+        "sass": "^1.42.1",
+        "sass-loader": "^12.2.0",
+        "svg-spritemap-webpack-plugin": "^4.3.3"
+    }
+}

public/css/styles.css

@@ -0,0 +1 @@
+

public/js/main.js

@@ -0,0 +1,169 @@
+/******/ (() => { // webpackBootstrap
+/******/ 	var __webpack_modules__ = ({
+
+/***/ "./resources/js/main.js":
+/*!******************************!*\
+  !*** ./resources/js/main.js ***!
+  \******************************/
+/***/ (() => {
+
+
+
+/***/ }),
+
+/***/ "./resources/scss/styles.scss":
+/*!************************************!*\
+  !*** ./resources/scss/styles.scss ***!
+  \************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+// extracted by mini-css-extract-plugin
+
+
+/***/ })
+
+/******/ 	});
+/************************************************************************/
+/******/ 	// The module cache
+/******/ 	var __webpack_module_cache__ = {};
+/******/ 	
+/******/ 	// The require function
+/******/ 	function __webpack_require__(moduleId) {
+/******/ 		// Check if module is in cache
+/******/ 		var cachedModule = __webpack_module_cache__[moduleId];
+/******/ 		if (cachedModule !== undefined) {
+/******/ 			return cachedModule.exports;
+/******/ 		}
+/******/ 		// Create a new module (and put it into the cache)
+/******/ 		var module = __webpack_module_cache__[moduleId] = {
+/******/ 			// no module.id needed
+/******/ 			// no module.loaded needed
+/******/ 			exports: {}
+/******/ 		};
+/******/ 	
+/******/ 		// Execute the module function
+/******/ 		__webpack_modules__[moduleId](module, module.exports, __webpack_require__);
+/******/ 	
+/******/ 		// Return the exports of the module
+/******/ 		return module.exports;
+/******/ 	}
+/******/ 	
+/******/ 	// expose the modules object (__webpack_modules__)
+/******/ 	__webpack_require__.m = __webpack_modules__;
+/******/ 	
+/************************************************************************/
+/******/ 	/* webpack/runtime/chunk loaded */
+/******/ 	(() => {
+/******/ 		var deferred = [];
+/******/ 		__webpack_require__.O = (result, chunkIds, fn, priority) => {
+/******/ 			if(chunkIds) {
+/******/ 				priority = priority || 0;
+/******/ 				for(var i = deferred.length; i > 0 && deferred[i - 1][2] > priority; i--) deferred[i] = deferred[i - 1];
+/******/ 				deferred[i] = [chunkIds, fn, priority];
+/******/ 				return;
+/******/ 			}
+/******/ 			var notFulfilled = Infinity;
+/******/ 			for (var i = 0; i < deferred.length; i++) {
+/******/ 				var [chunkIds, fn, priority] = deferred[i];
+/******/ 				var fulfilled = true;
+/******/ 				for (var j = 0; j < chunkIds.length; j++) {
+/******/ 					if ((priority & 1 === 0 || notFulfilled >= priority) && Object.keys(__webpack_require__.O).every((key) => (__webpack_require__.O[key](chunkIds[j])))) {
+/******/ 						chunkIds.splice(j--, 1);
+/******/ 					} else {
+/******/ 						fulfilled = false;
+/******/ 						if(priority < notFulfilled) notFulfilled = priority;
+/******/ 					}
+/******/ 				}
+/******/ 				if(fulfilled) {
+/******/ 					deferred.splice(i--, 1)
+/******/ 					var r = fn();
+/******/ 					if (r !== undefined) result = r;
+/******/ 				}
+/******/ 			}
+/******/ 			return result;
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/******/ 	/* webpack/runtime/hasOwnProperty shorthand */
+/******/ 	(() => {
+/******/ 		__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))
+/******/ 	})();
+/******/ 	
+/******/ 	/* webpack/runtime/make namespace object */
+/******/ 	(() => {
+/******/ 		// define __esModule on exports
+/******/ 		__webpack_require__.r = (exports) => {
+/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
+/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
+/******/ 			}
+/******/ 			Object.defineProperty(exports, '__esModule', { value: true });
+/******/ 		};
+/******/ 	})();
+/******/ 	
+/******/ 	/* webpack/runtime/jsonp chunk loading */
+/******/ 	(() => {
+/******/ 		// no baseURI
+/******/ 		
+/******/ 		// object to store loaded and loading chunks
+/******/ 		// undefined = chunk not loaded, null = chunk preloaded/prefetched
+/******/ 		// [resolve, reject, Promise] = chunk loading, 0 = chunk loaded
+/******/ 		var installedChunks = {
+/******/ 			"/public/js/main": 0,
+/******/ 			"public/css/styles": 0
+/******/ 		};
+/******/ 		
+/******/ 		// no chunk on demand loading
+/******/ 		
+/******/ 		// no prefetching
+/******/ 		
+/******/ 		// no preloaded
+/******/ 		
+/******/ 		// no HMR
+/******/ 		
+/******/ 		// no HMR manifest
+/******/ 		
+/******/ 		__webpack_require__.O.j = (chunkId) => (installedChunks[chunkId] === 0);
+/******/ 		
+/******/ 		// install a JSONP callback for chunk loading
+/******/ 		var webpackJsonpCallback = (parentChunkLoadingFunction, data) => {
+/******/ 			var [chunkIds, moreModules, runtime] = data;
+/******/ 			// add "moreModules" to the modules object,
+/******/ 			// then flag all "chunkIds" as loaded and fire callback
+/******/ 			var moduleId, chunkId, i = 0;
+/******/ 			if(chunkIds.some((id) => (installedChunks[id] !== 0))) {
+/******/ 				for(moduleId in moreModules) {
+/******/ 					if(__webpack_require__.o(moreModules, moduleId)) {
+/******/ 						__webpack_require__.m[moduleId] = moreModules[moduleId];
+/******/ 					}
+/******/ 				}
+/******/ 				if(runtime) var result = runtime(__webpack_require__);
+/******/ 			}
+/******/ 			if(parentChunkLoadingFunction) parentChunkLoadingFunction(data);
+/******/ 			for(;i < chunkIds.length; i++) {
+/******/ 				chunkId = chunkIds[i];
+/******/ 				if(__webpack_require__.o(installedChunks, chunkId) && installedChunks[chunkId]) {
+/******/ 					installedChunks[chunkId][0]();
+/******/ 				}
+/******/ 				installedChunks[chunkIds[i]] = 0;
+/******/ 			}
+/******/ 			return __webpack_require__.O(result);
+/******/ 		}
+/******/ 		
+/******/ 		var chunkLoadingGlobal = self["webpackChunk"] = self["webpackChunk"] || [];
+/******/ 		chunkLoadingGlobal.forEach(webpackJsonpCallback.bind(null, 0));
+/******/ 		chunkLoadingGlobal.push = webpackJsonpCallback.bind(null, chunkLoadingGlobal.push.bind(chunkLoadingGlobal));
+/******/ 	})();
+/******/ 	
+/************************************************************************/
+/******/ 	
+/******/ 	// startup
+/******/ 	// Load entry module and return exports
+/******/ 	// This entry module depends on other loaded chunks and execution need to be delayed
+/******/ 	__webpack_require__.O(undefined, ["public/css/styles"], () => (__webpack_require__("./resources/js/main.js")))
+/******/ 	var __webpack_exports__ = __webpack_require__.O(undefined, ["public/css/styles"], () => (__webpack_require__("./resources/scss/styles.scss")))
+/******/ 	__webpack_exports__ = __webpack_require__.O(__webpack_exports__);
+/******/ 	
+/******/ })()
+;

public/js/spritemap.js

@@ -0,0 +1,13 @@
+(self["webpackChunk"] = self["webpackChunk"] || []).push([["spritemap"],{
+
+/***/ "?4e0c":
+/*!******************************!*\
+  !*** spritemap-dummy-module ***!
+  \******************************/
+/***/ (() => {
+
+
+
+/***/ })
+
+}]);

resources/views/layout.blade.php

@@ -14,8 +14,8 @@
 
         <meta name="viewport" content="width=device-width, initial-scale=1">
 
-        <link href="{{ (isset($_SERVER['HTTPS']) ? 'https' : 'http').'://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'] }}" rel="canonical">
-        <link href="{{ asset('/css/index.css') }}" rel="stylesheet" type="text/css">
+        <link href="{{ canonical() }}" rel="canonical">
+        <link href="{{ asset('/css/styles.css') }}" rel="stylesheet" type="text/css">
 
         @stack('head')
     </head>

webpack.mix.js

@@ -0,0 +1,55 @@
+const mix = require('laravel-mix')
+const SvgSpritemapPlugin = require('svg-spritemap-webpack-plugin')
+
+const path = require('path')
+
+require('laravel-mix-purgecss')
+
+/*
+ |--------------------------------------------------------------------------
+ | Mix Asset Management
+ |--------------------------------------------------------------------------
+ |
+ | Mix provides a clean, fluent API for defining some Webpack build steps
+ | for your Laravel application. By default, we are compiling the Sass
+ | file for the application as well as bundling up all the JS files.
+ |
+ */
+
+mix.webpackConfig({
+    plugins: [
+        new SvgSpritemapPlugin([
+                'resources/icons/*.svg',
+            ], {
+            output: {
+                filename: 'public/symbol-defs.svg',
+                chunk: {
+                    keep: true
+                } 
+            },
+            sprite: {
+                prefix: 'icon-'
+            }
+        })
+    ]
+})
+
+mix.options({
+    terser: {
+        extractComments: false
+    },
+    processCssUrls: false
+})
+
+mix
+    .setPublicPath('./')
+    .js('resources/js/main.js', 'public/js')
+    .sass('resources/scss/styles.scss', 'public/css')
+    .purgeCss({
+        extend: {
+            content: [
+                path.join(__dirname, 'resources/views/**/*.php')
+            ]
+        }
+    })
+    .version()