rewrite to esmodule, upgrade deps, ampCreator setup param

- increase NodeJS min. version
- upgrade dependencies
- full rewrite as plain esmodule
- ALPHA (only for `require` atm.) add `twig.extraLogic` to reload logic
- typing fixes and optimizes
- add breaking `ampCreator` additional `setup` param, so not always `wrap` is needed

.travis.yml

@@ -1,6 +1,6 @@
 language: node_js
 node_js:
-  - 12
+  - 12.20
 install:
   - npm ci
 script:

Gulpfile.js

@@ -1,8 +1,9 @@
-'use strict'
-const path = require('path')
-const {ampCreator} = require('./src')
+import path from 'path'
+import gulp from 'gulp'
+import {ampCreator} from './src/index.js'
 
-module.exports = ampCreator({
+
+const tasks = ampCreator({
     port: 4488,
     paths: {
         styles: 'example/styles',
@@ -41,3 +42,5 @@ module.exports = ampCreator({
     },
     prettyUrlExtensions: ['html'],
 })
+
+Object.keys(tasks).forEach(taskName => gulp.task(taskName, tasks[taskName]))

LICENSE.md

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2020 Michael Becker, michael@bemit.codes
+Copyright (c) 2021 Michael Becker, michael@bemit.codes
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -5,15 +5,14 @@ Fast development of fast pages.
 [![npm (scoped)](https://img.shields.io/npm/v/create-amp-page?style=flat-square)](https://www.npmjs.com/package/create-amp-page)
 [![npm (scoped)](https://img.shields.io/npm/dm/create-amp-page.svg?style=flat-square)](https://npmcharts.com/compare/create-amp-page?interval=30)
 [![Travis (.com) master build](https://img.shields.io/travis/com/bemit/create-amp-page/master?style=flat-square)](https://travis-ci.com/bemit/create-amp-page)
-[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com) 
+[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)
 ![Typed](https://flat.badgen.net/badge/icon/Typed?icon=typescript&label&labelColor=blue&color=555555)
-[![try starter template](https://img.shields.io/badge/try%20starter%20template-grey?labelColor=fff&logoColor=505050&style=flat-square&logo=codesandbox)](https://codesandbox.io/s/github/bemit/create-amp-page-starter)
 
-Static site generator built with gulp tasks, using Twig templates, optimized for building [AMP](https://amp.dev) pages.
+Static site generator built with gulp tasks, using Twig templates, optimized for building [AMP](https://amp.dev) pages - but not limited to AMP.
 
 Support for Sass, CSS optimizing, CSS into head injection, media file compressing, automatic resizing of images by `srcset`, endless copy tasks, Twig global and optional per-page data with JSON and/or frontmatter, browsersync with custom static server middlewares, [AMP Optimizer](https://amp.dev/documentation/guides-and-tutorials/optimize-and-measure/amp-optimizer-guide/) or HTML Minifier (for non-AMP), remove unused CSS (currently only for inline CSS). Different ways to define pages, can be connected with e.g. netlify cms.
 
-Checkout the [starter template](https://github.com/bemit/create-amp-page-starter)!
+🚀 Checkout the [starter template repositories!](#starter-templates)
 
 ## Quick Start
 
@@ -87,9 +86,19 @@ module.exports = {
 
 **7.** Run `npm start` and happy coding!
 
-## Starter Template
+## Starter Templates
 
-Checkout this [AMP page start](https://github.com/bemit/create-amp-page-starter) for a preconfigured template repository.
+Checkout the starter repos:
+
+- ⚡ [bemit/create-amp-page-starter](https://github.com/bemit/create-amp-page-starter)
+    - ready configured for static AMP valid pages
+    - includes a simple twig template
+- ⚛️ [bemit/create-page-starter](https://github.com/bemit/create-page-starter)
+    - ready configured for static pages, non-AMP pages
+    - with babel/webpack build process
+      - support for typescript/react configured
+    - service worker example integrated
+    - includes a simple twig template
 
 ## Page generations
 
@@ -108,7 +117,7 @@ Two integrated ways of page generation:
 
 Get metadata and sizing for image, caches the read-result for each execution, purging cache on each watch trigger of html.
 
-- params: 
+- params:
     - `src` is the relative path to media folder incl. media folder
     - `srcset` is an array of objects, define in which image sizes the image should be resized
         - `w` = width in pixels, internally it calculates the other value proportional
@@ -117,7 +126,7 @@ Get metadata and sizing for image, caches the read-result for each execution, pu
     - `width` of file
     - `height` of file
     - `hash` sha1 hash of file content
-    
+
 #### getImage Twig Example
 
 Template using `getImage(src, srcset)` to fetch metadata and resize images when needed:
@@ -152,15 +161,15 @@ Embed then in file, pixels at `srcset`:
 {% endembed %}
 ```
 
-Generates HTML like: 
+Generates HTML like:
 
 ```html
- <amp-img
-    src="/media/img-01.png?key=2l8ybbe1tjSP"
-    width="1280" height="421"
-    srcset="/media/img-01_320w.png?key=2l8ybbe1tjSP 320w, /media/img-01_680w.png?key=2l8ybbe1tjSP 680w, /media/img-01_920w.png?key=2l8ybbe1tjSP 920w"
-    sizes="(max-width: 320px) 320px, (max-width: 600px) 680px"
-layout="responsive"
+<amp-img
+        src="/media/img-01.png?key=2l8ybbe1tjSP"
+        width="1280" height="421"
+        srcset="/media/img-01_320w.png?key=2l8ybbe1tjSP 320w, /media/img-01_680w.png?key=2l8ybbe1tjSP 680w, /media/img-01_920w.png?key=2l8ybbe1tjSP 920w"
+        sizes="(max-width: 320px) 320px, (max-width: 600px) 680px"
+        layout="responsive"
 ></amp-img>
 ```
 
@@ -186,7 +195,7 @@ This project is free software distributed under the **MIT License**.
 
 See: [LICENSE](LICENSE).
 
-© 2020 [Michael Becker](https://mlbr.xyz)
+© 2021 [Michael Becker](https://mlbr.xyz)
 
 ### Versions
 

example/html/_base.twig

@@ -13,27 +13,12 @@
     {% if head.keywords %}
         <meta name="keywords" content="{{ head.keywords }}">
     {% endif %}
-    {# {% if head.lang %}
-        <meta http-equiv="language" content="{{ head.lang }}">
-    {% endif %} #}
 
     <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
 
     {% if links.canonical %}
         <link rel="canonical" href="{{ links.canonical }}">
     {% endif %}
-
-    {# <script type="application/ld+json">
-        {
-            "@context": "http://schema.org",
-            "@type": "NewsArticle",
-            "headline": "Open-source framework for publishing content",
-            "datePublished": "2015-10-07T12:02:41Z",
-            "image": [
-                "logo.jpg"
-            ]
-        }
-    </script> #}
 {% endblock %}
 
 {% block head_style %}
@@ -55,7 +40,7 @@
 {% block footer_inner__ %}
     <div class="footer--end">
         <p class="center">
-            © 2015 - 2020
+            © 2015 - 2021
             <a href="https://mlbr.xyz">Michael Becker</a>,
             <a href="https://bemit.eu">bemit<small> UG (haftungsbeschränkt)</small></a>
         </p>