Release 5.13.0

pnikolov · pnikolov · commit eb37598c9cd8 · 2022-04-19T14:20:37.000+03:00
- Video files support by default
- EJS template files support
- Dependency packages versions update.
diff --git a/.gitignore b/.gitignore
@@ -16,7 +16,11 @@ nbproject/*
 # Windows
 Thumbs.db
 
+# Debugging related
 npm-debug.log
 
+# Dependency packages files
 node_modules/
+
+# Output
 dist/
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,23 @@
 # Change log
 
+## [5.13.0](https://github.com/WeAreAthlon/frontend-webpack-boilerplate/releases/tag/v5.13.0)
+### 19/04/2022
+
+### New Features
+
+* Add support for videos in the default webpack configuration. ([Issue #45 Video Assets](https://github.com/WeAreAthlon/frontend-webpack-boilerplate/issues/45))
+  * HTML `<video>` tag.
+* Add support for [`ejs`](https://www.npmjs.com/package/ejs) template files. ([PR#28 Add support ejs files](https://github.com/WeAreAthlon/frontend-webpack-boilerplate/pull/28))
+
+### Package Versions Update
+
++ `@babel/core@7.17.9` change log can be found on the official [release notes](https://github.com/babel/babel/releases/tag/v7.17.9).
++ `eslint@8.13.0` change log can be found on the official [release notes](https://github.com/eslint/eslint/releases/tag/v8.13.0).
++ `eslint-plugin-import@2.26.0` change log can be found on the official [release notes](https://github.com/yannickcr/eslint-plugin-react/releases/tag/v7.26.0).
++ `sass@1.50.1` change log can be found on the official [release notes](https://github.com/sass/dart-sass/releases/tag/1.50.1).
++ `webpack@5.72.0` change log can be found on the official [release notes](https://github.com/webpack/webpack/releases/tag/v5.72.0).
++ `webpack-dev-server@4.8.1` change log can be found on the official [release notes](https://github.com/webpack/webpack-dev-server/releases/tag/v4.8.1).
+
 ## [5.12.1](https://github.com/WeAreAthlon/frontend-webpack-boilerplate/releases/tag/v5.12.1)
 ### 01/02/2022
 
diff --git a/LICENSE b/LICENSE
@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2022 Athlon DPS
+Copyright (c) 2022 Athlon Sofia
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
diff --git a/README.md b/README.md
@@ -1,7 +1,7 @@
 # Webpack 5 Boilerplate Template
 
 ![Maintenance](https://img.shields.io/maintenance/yes/2022?logo=github)
-![webpack-current](https://img.shields.io/badge/webpack-v5.69.1-green?logo=webpack)
+![webpack-current](https://img.shields.io/badge/webpack-v5.72.0-green?logo=webpack)
 ![node-current (scoped)](https://img.shields.io/node/v/@weareathlon/frontend-webpack-boilerplate)
 [![Build Status](https://app.travis-ci.com/WeAreAthlon/frontend-webpack-boilerplate.svg?branch=master)](https://app.travis-ci.com/github/WeAreAthlon/frontend-webpack-boilerplate)
 [![@weareathlon/frontend-webpack-boilerplate](https://snyk.io/advisor/npm-package/@weareathlon/frontend-webpack-boilerplate/badge.svg)](https://snyk.io/advisor/npm-package/@weareathlon/frontend-webpack-boilerplate)
@@ -68,6 +68,7 @@ Table of Contents
   * *SASS / PostCSS*
   * *HTML* templates
   * *Images* (*CSS backgrounds and image tags*)
+  * *Videos*
   * *Fonts*
 * Support for **assets optimization** for production environment with ability to configure:
   * **Code Minification** of *JavaScript* and *CSS* processed files.
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "author": "WeAreAthlon <hello@weareathlon.com> (https://www.weareathlon.com)",
   "name": "@weareathlon/frontend-webpack-boilerplate",
-  "version": "5.12.1",
+  "version": "5.13.0",
   "description": "Starter project template boilerplate based on Webpack with SASS/PostCSS and babel ES6/7 support.",
   "homepage": "https://github.com/WeAreAthlon/frontend-webpack-boilerplate#readme",
   "browserslist": [
@@ -20,17 +20,17 @@
     }
   ],
   "devDependencies": {
-    "@babel/core": "^7.16.0",
+    "@babel/core": "^7.17.9",
     "@babel/preset-env": "^7.16.0",
     "autoprefixer": "^10.4.0",
     "babel-loader": "^8.2.3",
     "clean-webpack-plugin": "^4.0.0",
     "copy-webpack-plugin": "^10.2.3",
     "css-loader": "^6.5.1",
     "css-minimizer-webpack-plugin": "^3.1.1",
-    "eslint": "^8.2.0",
+    "eslint": "^8.13.0",
     "eslint-config-airbnb": "^19.0.0",
-    "eslint-plugin-import": "^2.25.3",
+    "eslint-plugin-import": "^2.26.0",
     "eslint-plugin-jsx-a11y": "^6.5.1",
     "eslint-plugin-react": "^7.27.0",
     "eslint-plugin-react-hooks": "^4.3.0",
@@ -44,14 +44,14 @@
     "mini-css-extract-plugin": "^2.4.4",
     "postcss": "^8.3.11",
     "postcss-loader": "^6.2.0",
-    "sass": "^1.43.4",
+    "sass": "^1.50.1",
     "sass-lint": "^1.13.1",
     "sass-loader": "^12.3.0",
     "terser-webpack-plugin": "^5.2.5",
-    "webpack": "^5.68.0",
+    "webpack": "^5.72.0",
     "webpack-bundle-analyzer": "^4.5.0",
     "webpack-cli": "^4.9.1",
-    "webpack-dev-server": "^4.4.0",
+    "webpack-dev-server": "^4.8.1",
     "webpack-merge": "^5.8.0"
   },
   "engines": {
diff --git a/src/index.html b/src/index.html
@@ -14,7 +14,7 @@ <h1>Webpack 5 Template Boilerplate</h1>
       <small>Maintained by <a href="https://www.weareathlon.com/" target="_blank" rel="noopener">WeAreAthlon</a>. Source code availalbe on <a href="https://github.com/WeAreAthlon/frontend-webpack-boilerplate/" target="_blank"><img src="images/content/github.png" alt="GitHub logo"> GitHub</a>.</small>
       <div class="badges">
         <a href="https://github.com/WeAreAthlon/frontend-webpack-boilerplate/" target="_blank" rel="noopener"><img src="https://img.shields.io/maintenance/yes/2022?logo=github" alt="Maintenance"></a>
-        <a href="https://webpack.js.org" target="_blank" rel="noopener"><img src="https://img.shields.io/badge/webpack-v5.69.1-green?logo=webpack" alt="Current Webpack Version"></a>
+        <a href="https://webpack.js.org" target="_blank" rel="noopener"><img src="https://img.shields.io/badge/webpack-v5.72.0-green?logo=webpack" alt="Current Webpack Version"></a>
         <a href="https://app.travis-ci.com/github/WeAreAthlon/frontend-webpack-boilerplate" target="_blank" rel="noopener"><img src="https://app.travis-ci.com/WeAreAthlon/frontend-webpack-boilerplate.svg?branch=master" alt="Build Status"></a>
         <a href="https://snyk.io/advisor/npm-package/@weareathlon/frontend-webpack-boilerplate" target="_blank" rel="noopener"><img src="https://snyk.io/advisor/npm-package/@weareathlon/frontend-webpack-boilerplate/badge.svg" alt="Snyk.io package health badge"></a>
         <br>
@@ -126,6 +126,7 @@ <h2 id="features">Features</h2>
             <li><em>SASS / PostCSS</em></li>
             <li><em>HTML</em> templates</li>
             <li><em>Images</em> (<em>CSS backgrounds and image tags</em>)</li>
+            <li><em>Videos</em></li>
             <li><em>Fonts</em></li>
           </ul>
         </li>
@@ -290,6 +291,11 @@ <h2 id="run-assets-bundle-analyzer">Run Assets Bundle Analyzer</h2>
       <h2 id="continuous-integration">Continuous Integration</h2>
       <p>This boilerplate template contains integration with <a href="https://travis-ci.org/">Travis CI</a>. The build system runs all linting scripts and deploys production optimized pages to <em>GitHub</em> pages upon push to the <code>master</code> branch. However, note that this deployment flow only works for <em>Project Pages</em>, as User and Organization pages <a href="https://help.github.com/articles/user-organization-and-project-pages/">only support the master branch flow</a>.</p>
       <p>For more information on how to set up alternative deployment processes, check out the <a href="https://docs.travis-ci.com/user/deployment">Travis CI documentation on deployment</a>. The service can deploy to dozens of cloud providers, including Heroku, AWS, and Firebase.</p>
+      <h2 id="video-files">Video File Preview</h2>
+      <video width="1024" height="576" controls>
+        <source src="videos/video.webm" type="video/webm">
+        Your browser does not support the video tag.
+      </video>
     </main>
     <footer>
       <address>Documentation avaialable on the official <a href="https://github.com/WeAreAthlon/frontend-webpack-boilerplate/" target="_blank" rel="noopener">GitHub Repository</a>.</address>
diff --git a/src/js/demo.js b/src/js/demo.js
@@ -1,4 +1,4 @@
-const demo = () => 'Webpack Boilerplate v5.12.1 - SASS/PostCSS, ES6/7, browser sync, source code listing and more.';
+const demo = () => 'Webpack Boilerplate v5.13.0 - SASS/PostCSS, ES6/7, browser sync, source code listing and more.';
 
 // eslint-disable-next-line no-console
 console.log(demo());
diff --git a/src/scss/demo.scss b/src/scss/demo.scss
@@ -52,6 +52,11 @@ main {
     text-align: center;
     padding: 10px;
   }
+
+  video {
+    margin: 0 auto;
+    display: block;
+  }
 }
 
 .badges {
diff --git a/src/videos/video.webm b/src/videos/video.webm
diff --git a/webpack.config.js b/webpack.config.js
@@ -120,6 +120,14 @@ module.exports = {
             ignore: ['*.DS_Store', 'Thumbs.db'],
           },
         },
+        {
+          from: path.resolve(environment.paths.source, 'videos'),
+          to: path.resolve(environment.paths.output, 'videos'),
+          toType: 'dir',
+          globOptions: {
+            ignore: ['*.DS_Store', 'Thumbs.db'],
+          },
+        },
       ],
     }),
   ].concat(htmlPluginEntries),

Original file line number	Diff line number	Diff line change
`@@ -52,6 +52,11 @@ main {`
`52`	`52`	`text-align: center;`
`53`	`53`	`padding: 10px;`
`54`	`54`	`}`
	`55`	`+`
	`56`	`+ video {`
	`57`	`+ margin: 0 auto;`
	`58`	`+ display: block;`
	`59`	`+ }`
`55`	`60`	`}`
`56`	`61`
`57`	`62`	`.badges {`