feat(example): add example for ESM (#79)

Add an example inside the example directory to show the example of how to use the package with the
ECMAScript modules standard for the Node.js environment (i.e. import/export syntax)

Resolves #72

Signed-off-by: Niloy Sikdar <niloysikdar30@gmail.com>

example/fixup.sh

@@ -0,0 +1,7 @@
+cat >lib/esm/package.json <<!EOF
+{
+    "type": "module"
+}
+!EOF
+
+echo "Fixup done."

example/generate-esm/index.js

@@ -1 +1,9 @@
-console.log('This will be used with ECMAScript Modules');
+import { generateEmail, generateTextEmail } from '@leopardslab/react-email';
+
+import { HelloEmail } from '../lib/esm';
+
+const htmlEmail = generateEmail(HelloEmail({ name: 'John' }));
+console.log(`HTML email: ${htmlEmail}`);
+
+const textEmail = generateTextEmail(HelloEmail({ name: 'John' }));
+console.log(`Text email: ${textEmail}`);

example/generate-esm/package.json

@@ -5,6 +5,6 @@
   "type": "module",
   "main": "index.js",
   "scripts": {
-    "generate": "node index.js"
+    "generate": "node --experimental-specifier-resolution=node index.js"
   }
 }

example/package.json

@@ -4,9 +4,10 @@
   "license": "MIT",
   "scripts": {
     "prepare": "yarn build",
-    "build": "rm -rf lib && yarn build:esm && yarn build:cjs",
+    "build": "rm -rf lib && yarn build:esm && yarn build:cjs && yarn fixup",
     "build:esm": "tsc -p tsconfig.json",
-    "build:cjs": "tsc -p tsconfig.json --module commonjs --outDir lib/cjs --target es2015"
+    "build:cjs": "tsc -p tsconfig.json --module commonjs --outDir lib/cjs --target es2015",
+    "fixup": "chmod u+rx ./fixup.sh && ./fixup.sh"
   },
   "dependencies": {
     "@leopardslab/react-email": "file:leopardslab-react-email-1.7.0.tgz"

example/tsconfig.json

@@ -1,21 +1,29 @@
 {
   "compilerOptions": {
-    "outDir": "lib/esm",
-    "module": "ESNext",
     "target": "ESNext",
-    "lib": ["ES6", "DOM", "ESNext"],
-    "jsx": "react-jsx",
-    "declaration": true,
+    "module": "ESNext",
     "moduleResolution": "node",
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
+    "declaration": true,
+    "strict": true,
+    "noImplicitAny": true /* Raise error on expressions and declarations with an implied 'any' type. */,
+    "strictNullChecks": true /* Enable strict null checks. */,
+    "strictFunctionTypes": true /* Enable strict checking of function types. */,
+    "noUnusedLocals": true /* Report errors on unused locals. */,
+    "noUnusedParameters": true /* Report errors on unused parameters. */,
+    "noImplicitReturns": true /* Report error when not all code paths in function return a value. */,
+    "noFallthroughCasesInSwitch": true /* Report errors for fallthrough cases in switch statement. */,
+    "importHelpers": true,
+    "skipLibCheck": true,
     "esModuleInterop": true,
-    "noImplicitReturns": true,
-    "noImplicitThis": true,
-    "noImplicitAny": true,
-    "strictNullChecks": true,
-    "suppressImplicitAnyIndexErrors": true,
-    "allowSyntheticDefaultImports": true
+    "allowSyntheticDefaultImports": true,
+    "experimentalDecorators": true,
+    "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */,
+    "baseUrl": "src",
+    "rootDir": "src",
+    "outDir": "./lib/esm",
+    "lib": ["ESNext", "DOM"],
+    "jsx": "react-jsx",
+    "pretty": true
   },
   "include": ["src/**/*"],
   "exclude": ["node_modules", "lib"]

example/yarn.lock

@@ -3,18 +3,52 @@
 
 
 "@leopardslab/react-email@file:leopardslab-react-email-1.7.0.tgz":
-  version "1.7.0"
-  resolved "file:leopardslab-react-email-1.7.0.tgz"
-  integrity sha512-sQbKH/PeRRDlozw133EM7IfaqQdtVIWCygQ52TO2QJONdtwWlwNq+IH8J3d07NMRuSwLPJwQP8yjDkJnk3dbiQ==
+  "integrity" "sha512-BGxNV7Qmfo20TbCQdakvEQEORP5ORuEXYiaUvuykZxzYt8aL6gImff2HIJu7AEpIGo84BE21NQ0cq1HZDwYV/A=="
+  "resolved" "file:leopardslab-react-email-1.7.0.tgz"
+  "version" "1.7.0"
   dependencies:
-    textversionjs "^1.1.3"
+    "textversionjs" "^1.1.3"
 
-textversionjs@^1.1.3:
-  version "1.1.3"
-  resolved "https://registry.npmjs.org/textversionjs/-/textversionjs-1.1.3.tgz"
-  integrity sha512-yZbBK7+1KRkgTJFOeIkCbQSZ+jR9ojDO/KrUKN3xEA6hA/DCMJ+aMWqjZ0rpxBJDjesbP795P5NEw+j3NnWJtA==
+"js-tokens@^3.0.0 || ^4.0.0":
+  "integrity" "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
+  "resolved" "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz"
+  "version" "4.0.0"
 
-typescript@^4.7.4:
-  version "4.7.4"
-  resolved "https://registry.yarnpkg.com/typescript/-/typescript-4.7.4.tgz#1a88596d1cf47d59507a1bcdfb5b9dfe4d488235"
-  integrity sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ==
+"loose-envify@^1.1.0":
+  "integrity" "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q=="
+  "resolved" "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz"
+  "version" "1.4.0"
+  dependencies:
+    "js-tokens" "^3.0.0 || ^4.0.0"
+
+"react-dom@>=16.8":
+  "integrity" "sha512-6IMTriUmvsjHUjNtEDudZfuDQUoWXVxKHhlEGSk81n4YFS+r/Kl99wXiwlVXtPBtJenozv2P+hxDsw9eA7Xo6g=="
+  "resolved" "https://registry.npmjs.org/react-dom/-/react-dom-18.2.0.tgz"
+  "version" "18.2.0"
+  dependencies:
+    "loose-envify" "^1.1.0"
+    "scheduler" "^0.23.0"
+
+"react@^18.2.0", "react@>=16.8":
+  "integrity" "sha512-/3IjMdb2L9QbBdWiW5e3P2/npwMBaU9mHCSCUzNln0ZCYbcfTsGbTJrU/kGemdH2IWmB2ioZ+zkxtmq6g09fGQ=="
+  "resolved" "https://registry.npmjs.org/react/-/react-18.2.0.tgz"
+  "version" "18.2.0"
+  dependencies:
+    "loose-envify" "^1.1.0"
+
+"scheduler@^0.23.0":
+  "integrity" "sha512-CtuThmgHNg7zIZWAXi3AsyIzA3n4xx7aNyjwC2VJldO2LMVDhFK+63xGqq6CsJH4rTAt6/M+N4GhZiDYPx9eUw=="
+  "resolved" "https://registry.npmjs.org/scheduler/-/scheduler-0.23.0.tgz"
+  "version" "0.23.0"
+  dependencies:
+    "loose-envify" "^1.1.0"
+
+"textversionjs@^1.1.3":
+  "integrity" "sha512-yZbBK7+1KRkgTJFOeIkCbQSZ+jR9ojDO/KrUKN3xEA6hA/DCMJ+aMWqjZ0rpxBJDjesbP795P5NEw+j3NnWJtA=="
+  "resolved" "https://registry.npmjs.org/textversionjs/-/textversionjs-1.1.3.tgz"
+  "version" "1.1.3"
+
+"typescript@^4.7.4":
+  "integrity" "sha512-C0WQT0gezHuw6AdY1M2jxUO83Rjf0HP7Sk1DtXj6j1EwkQNZrHAg2XPWlq62oqEhYvONq5pkC2Y9oPljWToLmQ=="
+  "resolved" "https://registry.npmjs.org/typescript/-/typescript-4.7.4.tgz"
+  "version" "4.7.4"