feat: Convert to ESM (#119)

* feat: Convert to ESM

BREAKING CHANGE: Convert from CommonJS to ESM

* feat: convert to ESM

* fix: Remove outcommented code

* ci: Add build step for backward compat to CJS

* ci: Ignore linting dist directory

Co-authored-by: Trygve Lie <trygve.lie@finn.no>

.eslintignore

@@ -1 +1,2 @@
 coverage/
+dist/

.eslintrc

@@ -6,9 +6,15 @@
         "ecmaVersion": 11,
         "sourceType": "module"
     },
-    "rules": {
-        "lines-between-class-members": [0],
-        "class-methods-use-this": [0],
-        "strict": [0, "global"]
-    }
+  "rules": {
+    "import/prefer-default-export": "off",
+    "class-methods-use-this": [0],
+    "lines-between-class-members": [0],
+    "import/extensions": ["error", {
+      "js": "ignorePackages"
+      }
+    ]
+  }
 }
+
+

.github/workflows/publish.yml

@@ -17,7 +17,7 @@ jobs:
   - name: Setup Node.js
     uses: actions/setup-node@v1
     with:
-      node-version: 12.x
+      node-version: 14.x
   - name: npm install
     run: |
       npm install
@@ -38,7 +38,7 @@ jobs:
   - name: Setup Node.js
     uses: actions/setup-node@v1
     with:
-      node-version: 12.x
+      node-version: 14.x
   - name: npm install
     run: |
       npm install

.github/workflows/test.yml

@@ -8,7 +8,7 @@ jobs:
     strategy:
       matrix:
         os: [ubuntu-latest, macOS-latest, windows-latest]
-        node-version: [12.x, 14.x]
+        node-version: [12.x, 14.x, 16.x]
     steps:
       - uses: actions/checkout@v2
       - name: Use Node.js ${{ matrix.node-version }}

.gitignore

@@ -5,3 +5,4 @@ coverage/
 node_modules/
 *.log
 .vscode
+dist

benchmark/benchmark.js

@@ -1,4 +1,4 @@
-'use strict';
+
 
 /* eslint no-unused-vars: "off", import/no-extraneous-dependencies: "off", no-console: "off" */
 

dist/package.json

@@ -0,0 +1,3 @@
+{
+    "type": "commonjs"
+}

lib/asset-css.js

@@ -1,7 +1,5 @@
-'use strict';
-
-const { uriIsRelative, pathnameBuilder } = require('./utils');
-const { buildLinkElement, buildReactLinkAttributes } = require('./html-utils');
+import { uriIsRelative, pathnameBuilder } from './utils.js';
+import { buildLinkElement, buildReactLinkAttributes } from './html-utils.js';
 
 const inspect = Symbol.for('nodejs.util.inspect.custom');
 
@@ -14,7 +12,7 @@ const toUndefined = value => {
     return value;
 };
 
-const PodiumAssetCss = class PodiumAssetCss {
+export default class PodiumAssetCss {
     #crossorigin;
     #pathname;
     #disabled;
@@ -180,5 +178,3 @@ const PodiumAssetCss = class PodiumAssetCss {
         return 'PodiumAssetCss';
     }
 };
-
-module.exports = PodiumAssetCss;

lib/asset-js.js

@@ -1,7 +1,7 @@
-'use strict';
 
-const { uriIsRelative, pathnameBuilder } = require('./utils');
-const { buildScriptElement, buildReactScriptAttributes } = require('./html-utils');
+
+import { uriIsRelative, pathnameBuilder } from './utils.js';
+import { buildScriptElement, buildReactScriptAttributes } from './html-utils.js';
 
 const inspect = Symbol.for('nodejs.util.inspect.custom');
 
@@ -15,7 +15,7 @@ const toUndefined = (value) => {
     return value;
 };
 
-const PodiumAssetJs = class PodiumAssetJs {
+export default class PodiumAssetJs {
     #referrerpolicy;
     #crossorigin;
     #integrity;
@@ -181,5 +181,3 @@ const PodiumAssetJs = class PodiumAssetJs {
         return 'PodiumAssetJs';
     }
 };
-
-module.exports = PodiumAssetJs;

lib/html-document.js

@@ -1,8 +1,6 @@
-'use strict';
+import * as utils from './html-utils.js';
 
-const utils = require('./html-utils');
-
-const document = (incoming = {}, body = '', head = '') => {
+export const document = (incoming = {}, body = '', head = '') => {
     let scripts = incoming.js;
     let styles = incoming.css;
 
@@ -26,5 +24,3 @@ const document = (incoming = {}, body = '', head = '') => {
     </body>
 </html>`;
 };
-
-module.exports = document;

lib/html-utils.js

@@ -1,16 +1,14 @@
 /* eslint-disable no-restricted-syntax */
 
-'use strict';
-
-const notEmpty = (value) => {
+export const notEmpty = (value) => {
     if (value === false) return value;
     if (value === undefined) return false;
     if (value === null) return false;
     if (value !== '') return true;
     return false;
 };
 
-const buildScriptAttributes = (obj) => {
+export const buildScriptAttributes = (obj) => {
     const args = [];
     args.push({ key: 'src', value: obj.value });
 
@@ -52,7 +50,7 @@ const buildScriptAttributes = (obj) => {
     return args;
 };
 
-const buildReactScriptAttributes = (obj) => {
+export const buildReactScriptAttributes = (obj) => {
     const attrs = {};
     for (const { key, value } of buildScriptAttributes(obj)) {
         if (key === 'crossorigin') attrs.crossOrigin = value || '';
@@ -64,15 +62,15 @@ const buildReactScriptAttributes = (obj) => {
     return attrs;
 }
 
-const buildScriptElement = (obj) => {
+export const buildScriptElement = (obj) => {
     const attrs = buildScriptAttributes(obj).map(({key, value}) => {
         if (!value && value !== '') return key;
         return `${key}="${value}"`;
     })
     return `<script ${attrs.join(' ')}></script>`;
 };
 
-const buildLinkAttributes = (obj) => {
+export const buildLinkAttributes = (obj) => {
     const args = [];
     args.push({ key: 'href', value: obj.value });
 
@@ -112,7 +110,7 @@ const buildLinkAttributes = (obj) => {
     return args;
 };
 
-const buildReactLinkAttributes = (obj) => {
+export const buildReactLinkAttributes = (obj) => {
     const attrs = {};
     for (const { key, value } of buildLinkAttributes(obj)) {
         if (key === 'crossorigin') attrs.crossOrigin = value || '';
@@ -123,17 +121,10 @@ const buildReactLinkAttributes = (obj) => {
     return attrs;
 }
 
-const buildLinkElement = (obj) => {
+export const buildLinkElement = (obj) => {
     const attrs = buildLinkAttributes(obj).map(({key, value}) => {
         if (!value && value !== '') return key;
         return `${key}="${value}"`;
     })
     return `<link ${attrs.join(' ')}>`;
 };
-
-module.exports.buildLinkAttributes = buildLinkAttributes;
-module.exports.buildReactLinkAttributes = buildReactLinkAttributes;
-module.exports.buildScriptAttributes = buildScriptAttributes;
-module.exports.buildReactScriptAttributes = buildReactScriptAttributes;
-module.exports.buildScriptElement = buildScriptElement;
-module.exports.buildLinkElement = buildLinkElement;

lib/http-incoming.js

@@ -1,7 +1,5 @@
-'use strict';
-
-const originalUrl = require('original-url');
-const { URL } = require('url');
+import originalUrl from 'original-url';
+import { URL } from 'url';
 
 const inspect = Symbol.for('nodejs.util.inspect.custom');
 
@@ -14,7 +12,7 @@ const urlFromRequest = request => {
     }
 };
 
-const PodiumHttpIncoming = class PodiumHttpIncoming {
+export default class PodiumHttpIncoming {
     #development;
     #response;
     #request;
@@ -192,5 +190,3 @@ const PodiumHttpIncoming = class PodiumHttpIncoming {
         return 'PodiumHttpIncoming';
     }
 };
-
-module.exports = PodiumHttpIncoming;

lib/main.js

@@ -1,26 +1,24 @@
-'use strict';
+import * as Incoming from "./http-incoming.js";
+import { document } from "./html-document.js";
+import * as Css from "./asset-css.js";
+import * as Js from "./asset-js.js";
+import * as utils from "./utils.js"
+import * as html from "./html-utils.js"
 
-const HttpIncoming = require('./http-incoming');
-const document = require('./html-document');
-const AssetCss = require('./asset-css');
-const AssetJs = require('./asset-js');
-const utils = require('./utils');
-const html = require('./html-utils');
-
-module.exports.isString = utils.isString;
-module.exports.isFunction = utils.isFunction;
-module.exports.uriBuilder = utils.uriBuilder;
-module.exports.uriIsRelative = utils.uriIsRelative;
-module.exports.pathnameBuilder = utils.pathnameBuilder;
-module.exports.uriRelativeToAbsolute = utils.uriRelativeToAbsolute;
-module.exports.setAtLocalsPodium = utils.setAtLocalsPodium;
-module.exports.getFromLocalsPodium = utils.getFromLocalsPodium;
-module.exports.duplicateOnLocalsPodium = utils.duplicateOnLocalsPodium;
-module.exports.serializeContext = utils.serializeContext;
-module.exports.deserializeContext = utils.deserializeContext;
-module.exports.buildScriptElement = html.buildScriptElement;
-module.exports.buildLinkElement = html.buildLinkElement;
-module.exports.HttpIncoming = HttpIncoming;
-module.exports.template = document;
-module.exports.AssetCss = AssetCss;
-module.exports.AssetJs = AssetJs;
+export const {isString} = utils;
+export const {isFunction} = utils;
+export const {uriBuilder} = utils;
+export const {uriIsRelative} = utils;
+export const {pathnameBuilder} = utils;
+export const {uriRelativeToAbsolute} = utils;
+export const {setAtLocalsPodium} = utils;
+export const {getFromLocalsPodium} = utils;
+export const {duplicateOnLocalsPodium} = utils;
+export const {serializeContext} = utils;
+export const {deserializeContext} = utils;
+export const {buildScriptElement} = html;
+export const {buildLinkElement} = html;
+export const HttpIncoming = Incoming;
+export const template = document;
+export const AssetCss = Css;
+export const AssetJs = Js;