chore(build): yarn & webpack 4 & path & assets.json

.babelrc

@@ -0,0 +1,5 @@
+{
+  "presets": ["env", "stage-3"],
+  "plugins": ["transform-runtime"],
+  "ignore": []
+}

.gitignore

@@ -1,2 +1,2 @@
-/src/node_modules/
-/.idea/
+node_modules/
+.idea/

data/even/assets.json

@@ -0,0 +1,6 @@
+{
+  "even": {
+    "css": "even.e06a665f.min.css",
+    "js": "even.1029e815.min.js"
+  }
+}

layouts/partials/head.html

@@ -33,7 +33,7 @@
 {{ with .Site.Params.googleVerification }}<meta name="google-site-verification" content="{{.}}" />{{ end }}
 
 <!-- Site Generator -->
-<meta name="generator" content="Hugo {{ .Hugo.Version }}" />
+<meta name="generator" content="Hugo {{ .Hugo.Version }} with even 4.0.0" />
 
 <!-- Permalink & RSSlink -->
 <link rel="canonical" href="{{ .Permalink }}" />
@@ -61,7 +61,7 @@
 {{- end }}
 
 <!-- Styles -->
-<link href="{{ "dist/even.min.css?v=3.2.0" | relURL }}" rel="stylesheet">
+<link href="{{ print "dist/" .Site.Data.even.assets.even.css | relURL }}" rel="stylesheet">
 {{ if .Site.Params.publicCDN.enable -}}
   {{ if .Site.Params.fancybox }}{{ .Site.Params.publicCDN.fancyboxCSS | safeHTML }}{{ end }}
 {{- else -}}

layouts/partials/scripts.html

@@ -36,7 +36,7 @@
   {{- end -}}
 </script>
 {{- if .Site.Params.publicCDN.enable -}}
-  {{ .Site.Params.publicCDN.flowchartDiagrams | safeHTML }}
+  {{ .Site.Params.publicCDN.flowchartDiagramsJS | safeHTML }}
 {{- else -}}
 <script src="{{ "lib/flowchartDiagrams/raphael-2.2.7.min.js" | relURL }}" integrity="sha256-67By+NpOtm9ka1R6xpUefeGOY8kWWHHRAKlvaTJ7ONI=" crossorigin="anonymous"></script>
 <script src="{{ "lib/flowchartDiagrams/flowchart-1.8.0.min.js" | relURL }}" integrity="sha256-zNGWjubXoY6rb5MnmpBNefO0RgoVYfle9p0tvOQM+6k=" crossorigin="anonymous"></script>
@@ -63,7 +63,7 @@
 <link rel="stylesheet" href="{{ "lib/js-sequence-diagrams/sequence-diagram-2.0.1.min.css" | relURL }}" integrity="sha384-6QbLKJMz5dS3adWSeINZe74uSydBGFbnzaAYmp+tKyq60S7H2p6V7g1TysM5lAaF" crossorigin="anonymous">
 {{- end -}}
 {{- end }}
-<script type="text/javascript" src="{{ "dist/even.min.js?v=3.2.0" | relURL }}"></script>
+<script type="text/javascript" src="{{ print "dist/" .Site.Data.even.assets.even.js | relURL }}"></script>
 
 {{- if and (or .Params.mathjax (and .Site.Params.mathjax (ne .Params.mathjax false))) (or .IsPage .IsHome) }}
   <script type="text/javascript">

package.json

@@ -0,0 +1,32 @@
+{
+  "name": "even-src",
+  "version": "1.0.0",
+  "description": "even source file",
+  "main": "index.js",
+  "scripts": {
+    "start": "hugo server --source=exampleSite --themesDir=../.. --disableFastRender",
+    "build": "webpack"
+  },
+  "author": "ahonn, olOwOlo",
+  "license": "MIT",
+  "devDependencies": {
+    "assets-webpack-plugin": "^3.8.4",
+    "autoprefixer": "^8.6.5",
+    "babel-core": "^6.26.3",
+    "babel-loader": "^7.1.5",
+    "babel-plugin-transform-runtime": "^6.23.0",
+    "babel-preset-env": "^1.7.0",
+    "babel-preset-stage-3": "^6.24.1",
+    "clean-webpack-plugin": "^0.1.19",
+    "css-loader": "^1.0.0",
+    "file-loader": "^1.1.11",
+    "mini-css-extract-plugin": "^0.4.1",
+    "node-sass": "^4.9.2",
+    "optimize-css-assets-webpack-plugin": "^4.0.3",
+    "postcss-loader": "^2.1.5",
+    "sass-loader": "^7.0.3",
+    "uglifyjs-webpack-plugin": "^1.2.7",
+    "webpack": "^4.15.1",
+    "webpack-cli": "^3.0.8"
+  }
+}

postcss.config.js

@@ -4,4 +4,4 @@ module.exports = {
       browsers: ['> 1%', 'last 2 versions', 'ie >= 9']
     })
   ]
-}
+};

src/.babelrc

@@ -1,10 +0,0 @@
-{
-  "presets": ["es2015","stage-2"],
-  "plugins": [
-    ["transform-runtime", {
-      "polyfill": false,
-      "regenerator": true
-    }]
-  ],
-  "ignore": []
-}

src/package.json

@@ -1,31 +0,0 @@
-{
-  "name": "even-src",
-  "version": "1.0.0",
-  "description": "even source file",
-  "main": "index.js",
-  "scripts": {
-    "start": "webpack",
-    "build": "webpack"
-  },
-  "author": "ahonn, olOwOlo",
-  "license": "MIT",
-  "devDependencies": {
-    "autoprefixer": "^7.2.4",
-    "babel-core": "^6.26.0",
-    "babel-loader": "^7.1.2",
-    "babel-plugin-transform-runtime": "^6.23.0",
-    "babel-preset-es2015": "^6.24.1",
-    "babel-preset-stage-2": "^6.24.1",
-    "css-loader": "^0.28.8",
-    "expose-loader": "^0.7.4",
-    "extract-text-webpack-plugin": "^3.0.2",
-    "file-loader": "^1.1.6",
-    "node-sass": "^4.7.2",
-    "postcss-loader": "^2.0.10",
-    "sass-loader": "^6.0.6",
-    "style-loader": "^0.19.1",
-    "uglifyjs-webpack-plugin": "^1.1.6",
-    "url-loader": "^0.6.2",
-    "webpack": "^3.10.0"
-  }
-}

src/webpack.config.js

@@ -1,54 +0,0 @@
-const path = require('path')
-const ExtractTextPlugin = require('extract-text-webpack-plugin')
-const UglifyJSPlugin = require('uglifyjs-webpack-plugin')
-
-const extractSass = new ExtractTextPlugin({
-  filename: `even.min.css`
-})
-
-module.exports = {
-  devtool: 'source-map',
-  entry: {
-    even: './js/main.js'
-  },
-  output: {
-    path: path.join(__dirname, '../static/dist'),
-    filename: `[name].min.js`
-  },
-  module: {
-    rules: [
-      {
-        test: /\.js$/,
-        exclude: /node_modules/,
-        loader: 'babel-loader'
-      },
-      {
-        test: /\.scss$/,
-        use: extractSass.extract({
-          use: [{
-            loader: 'css-loader', options: {minimize: true, sourceMap: true}
-          }, {
-            loader: 'postcss-loader', options: {sourceMap: true}
-          }, {
-            loader: 'sass-loader', options: {sourceMap: true}
-          }],
-          fallback: 'style-loader'
-        })
-      },
-      {
-        test: /iconfont\.(woff|woff2|eot|ttf|otf|svg)$/,
-        use: ['file-loader?name=[path][name].[ext]?hash=[hash:7]']
-      },
-      {
-        test: /apple-chancery-webfont\.(woff|woff2|eot|ttf|otf|svg)$/,
-        use: ['file-loader?name=[path][name].[ext]']
-      }
-    ]
-  },
-  plugins: [
-    extractSass,
-    new UglifyJSPlugin({
-      sourceMap: true
-    })
-  ]
-}

static/dist/even.min.js

@@ -1,2 +0,0 @@
-!function(e){var n={};function t(o){if(n[o])return n[o].exports;var a=n[o]={i:o,l:!1,exports:{}};return e[o].call(a.exports,a,a.exports,t),a.l=!0,a.exports}t.m=e,t.c=n,t.d=function(e,n,o){t.o(e,n)||Object.defineProperty(e,n,{configurable:!1,enumerable:!0,get:o})},t.n=function(e){var n=e&&e.__esModule?function(){return e.default}:function(){return e};return t.d(n,"a",n),n},t.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},t.p="",t(t.s=0)}([function(e,n,t){"use strict";var o=t(1);t(2),$(document).ready(function(){o.Even.backToTop(),o.Even.mobileNavbar(),o.Even.toc(),o.Even.fancybox()}),o.Even.flowchart(),o.Even.sequence(),hljs.initHighlighting(),o.Even.highlight()},function(e,n,t){"use strict";Object.defineProperty(n,"__esModule",{value:!0});var o={};o.backToTop=function(){var e=$("#back-to-top");$(window).scroll(function(){$(window).scrollTop()>100?e.fadeIn(1e3):e.fadeOut(1e3)}),e.click(function(){$("body,html").animate({scrollTop:0})})},o.mobileNavbar=function(){var e=$("#mobile-navbar"),n=$(".mobile-navbar-icon"),t=new Slideout({panel:document.getElementById("mobile-panel"),menu:document.getElementById("mobile-menu"),padding:180,tolerance:70});t.disableTouch(),n.click(function(){t.toggle()}),t.on("beforeopen",function(){e.addClass("fixed-open"),n.addClass("icon-click").removeClass("icon-out")}),t.on("beforeclose",function(){e.removeClass("fixed-open"),n.addClass("icon-out").removeClass("icon-click")}),$("#mobile-panel").on("touchend",function(){t.isOpen()&&n.click()})},o._initToc=function(){var e=$(".post-toc"),n=$(".post-footer");if(e.length){var t=e.offset().top-20,o=n.offset().top-e.height()-20,a={start:{position:"absolute",top:t},process:{position:"fixed",top:20},end:{position:"absolute",top:o}};$(window).scroll(function(){var n=$(window).scrollTop();n<t?e.css(a.start):n>o?e.css(a.end):e.css(a.process)})}var r=$(".toc-link"),c=$(".headerlink"),i=$(".post-toc-content li"),l=$.map(c,function(e){return $(e).offset().top}),s=$.map(l,function(e){return e-30});$(window).scroll(function(){var e=$(window).scrollTop(),n=function(e,n){for(var t=0;t<e.length-1;t++)if(n>e[t]&&n<=e[t+1])return t;return n>e[e.length-1]?e.length-1:-1}(s,e);if($(r).removeClass("active"),$(i).removeClass("has-active"),-1!==n){$(r[n]).addClass("active");for(var t=r[n].parentNode;"NAV"!==t.tagName;)$(t).addClass("has-active"),t=t.parentNode.parentNode}})},o.fancybox=function(){$.fancybox&&($(".post-content").each(function(){$(this).find("img").each(function(){$(this).wrap('<a class="fancybox" href="'+this.src+'" data-fancybox="gallery" data-caption="'+this.title+'"></a>')})}),$(".fancybox").fancybox({selector:".fancybox",protect:!0}))},o.highlight=function(){for(var e=document.querySelectorAll("pre code"),n=0;n<e.length;n++){var t=e[n],o=t.parentElement,a=t.innerHTML.split(/\n/);""===a[a.length-1]&&a.pop();for(var r=a.length,c="",i=0;i<r;i++)c+='<div class="line">'+(i+1)+"</div>";for(var l="",s=0;s<r;s++)l+='<div class="line">'+a[s]+"</div>";t.className+=" highlight";var d=document.createElement("figure");d.className=t.className,d.innerHTML='<table><tbody><tr><td class="gutter"><pre>'+c+'</pre></td><td class="code"><pre>'+l+"</pre></td></tr></tbody></table>",o.parentElement.replaceChild(d,o)}},o.toc=function(){var e=document.getElementById("post-toc");if(null!==e){var n=document.getElementById("TableOfContents");null===n?e.parentNode.removeChild(e):(this._refactorToc(n),this._linkToc(),this._initToc())}},o._refactorToc=function(e){for(var n=e.children[0],t=n,o=void 0;1===t.children.length&&"UL"===(o=t.children[0].children[0]).tagName;)t=o;t!==n&&e.replaceChild(t,n)},o._linkToc=function(){for(var e=document.querySelectorAll("#TableOfContents a:first-child"),n=0;n<e.length;n++)e[n].className+=" toc-link";for(var t=1;t<=6;t++)for(var o=document.querySelectorAll(".post-content>h"+t),a=0;a<o.length;a++){var r=o[a];r.innerHTML='<a href="#'+r.id+'" class="headerlink"></a>'+r.innerHTML}},o.flowchart=function(){if(window.flowchart)for(var e=document.querySelectorAll("pre code.language-flowchart"),n=0;n<e.length;n++){var t=e[n],o=t.parentElement,a=document.createElement("div"),r="js-flowchart-diagrams-"+n;a.id=r,a.className="align-center",o.parentElement.replaceChild(a,o),flowchart.parse(t.childNodes[0].nodeValue).drawSVG(r,window.flowchartDiagramsOptions?window.flowchartDiagramsOptions:{})}},o.sequence=function(){if(window.Diagram)for(var e=document.querySelectorAll("pre code.language-sequence"),n=0;n<e.length;n++){var t=e[n],o=t.parentElement,a=document.createElement("div"),r="js-sequence-diagrams-"+n;a.id=r,a.className="align-center",o.parentElement.replaceChild(a,o),Diagram.parse(t.childNodes[0].nodeValue).drawSVG(r,window.sequenceDiagramsOptions?window.sequenceDiagramsOptions:{theme:"simple"})}},n.Even=o},function(e,n){}]);
-//# sourceMappingURL=even.min.js.map

webpack.config.js

@@ -0,0 +1,87 @@
+const path = require('path');
+const CleanWebpackPlugin = require('clean-webpack-plugin');
+const MiniCssExtractPlugin = require("mini-css-extract-plugin");
+const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
+const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");
+const AssetsWebpackPlugin = require('assets-webpack-plugin');
+
+const extractSass = new MiniCssExtractPlugin({
+  filename: `even.[contenthash:8].min.css`
+});
+
+const cleanBuild = new CleanWebpackPlugin([
+  'static/dist/*'
+]);
+
+const assetsManifest = new AssetsWebpackPlugin({
+  filename: 'assets.json',
+  path: path.join(__dirname, 'data/even'),
+  fullPath: false,
+  processOutput: assets => {
+    const output = {};
+    Object.keys(assets)
+        .filter(bundle => bundle !== '')
+        .forEach(bundle => output[bundle] = assets[bundle]);
+    return JSON.stringify(output, null, 2);
+  }
+});
+
+module.exports = {
+  mode: 'production',
+  devtool: 'source-map',
+  entry: {
+    even: path.join(__dirname, 'src/js/main.js')
+  },
+  output: {
+    path: path.join(__dirname, 'static/dist'),
+    filename: `[name].[contenthash:8].min.js`,
+    chunkFilename: '[name].[contenthash:8].min.js',
+  },
+  module: {
+    rules: [
+      {
+        test: /\.js$/,
+        exclude: /node_modules/,
+        loader: 'babel-loader'
+      },
+      {
+        test: /\.scss$/,
+        use: [
+          MiniCssExtractPlugin.loader,
+          {
+            loader: 'css-loader', options: { minimize: true, sourceMap: true }
+          }, {
+            loader: 'postcss-loader', options: { sourceMap: true }
+          }, {
+            loader: 'sass-loader', options: { sourceMap: true }
+          }
+        ]
+      },
+      {
+        test: /iconfont\.(woff|woff2|eot|ttf|otf|svg)$/,
+        use: ['file-loader?name=[path][name].[ext]?hash=[hash:7]']
+      },
+      {
+        test: /apple-chancery-webfont\.(woff|woff2|eot|ttf|otf|svg)$/,
+        use: ['file-loader?name=[path][name].[ext]']
+      }
+    ]
+  },
+  plugins: [extractSass, assetsManifest, cleanBuild],
+  optimization: {
+    minimizer: [
+      new UglifyJsPlugin({
+        parallel: true,
+        sourceMap: true,
+      }),
+      new OptimizeCSSAssetsPlugin({
+        cssProcessorOptions: {
+          map: {
+            inline: false,
+            annotation: true,
+          }
+        }
+      })
+    ]
+  }
+};