From 34ae5284993567f5e11fb6a50a60681b6d812c60 Mon Sep 17 00:00:00 2001 From: Jake Howard Date: Sat, 29 Jun 2019 16:23:38 +0100 Subject: [PATCH] Render templates with values --- index.ts | 20 ++++++++++++++++- package-lock.json | 55 +++++++++++++++++++++++++++++++++++++++++++++++ package.json | 3 +++ src/template.html | 1 + 4 files changed, 78 insertions(+), 1 deletion(-) diff --git a/index.ts b/index.ts index 7149b10..2c652e0 100644 --- a/index.ts +++ b/index.ts @@ -1,6 +1,9 @@ import Bundler from 'parcel-bundler'; -import { join } from 'path'; +import { join, dirname } from 'path'; import rimraf from 'rimraf'; +import { readFileSync, writeFileSync } from 'fs'; +import Handlebars from 'handlebars'; +import mkdirp from 'mkdirp'; const BUILD_DIR = join(__dirname, 'build'); const SRC_DIR = join(__dirname, 'src'); @@ -11,10 +14,25 @@ const BUNDLER_OPTIONS = { minify: true, }; +function writeTemplate(content: string, value: string) { + const outputFile = join(BUILD_DIR, value, 'index.html'); + mkdirp.sync(dirname(outputFile)); + writeFileSync(outputFile, content); +} + +function renderTemplate(template: HandlebarsTemplateDelegate, value: number) { + const html = template({value}); + writeTemplate(html, value.toString()); +} + (async function() { rimraf.sync(BUILD_DIR); const bundler = new Bundler(join(SRC_DIR, 'template.html'), BUNDLER_OPTIONS); await bundler.bundle(); + + const template = Handlebars.compile(readFileSync(join(BUILD_DIR, 'template.html')).toString()); + + renderTemplate(template, 123); })(); diff --git a/package-lock.json b/package-lock.json index de68349..d607789 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1053,6 +1053,14 @@ "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.3.tgz", "integrity": "sha512-tHq6qdbT9U1IRSGf14CL0pUlULksvY9OZ+5eEgl1N7t+OA3tGvNpxJCzuKQlsNgCVwbAs670L1vcVQi8j9HjnA==" }, + "@types/mkdirp": { + "version": "0.5.2", + "resolved": "https://registry.npmjs.org/@types/mkdirp/-/mkdirp-0.5.2.tgz", + "integrity": "sha512-U5icWpv7YnZYGsN4/cmh3WD2onMY0aJIiTE6+51TwJCttdHvtCYmkBNOobHlXwrJRL0nkH9jH4kD+1FAdMN4Tg==", + "requires": { + "@types/node": "*" + } + }, "@types/node": { "version": "12.0.10", "resolved": "https://registry.npmjs.org/@types/node/-/node-12.0.10.tgz", @@ -3471,6 +3479,17 @@ "unicode-trie": "^0.3.1" } }, + "handlebars": { + "version": "4.1.2", + "resolved": "https://registry.npmjs.org/handlebars/-/handlebars-4.1.2.tgz", + "integrity": "sha512-nvfrjqvt9xQ8Z/w0ijewdD/vvWDTOweBUm96NTr66Wfvo1mJenBLwcYmPs3TIBP5ruzYGD7Hx/DaM9RmhroGPw==", + "requires": { + "neo-async": "^2.6.0", + "optimist": "^0.6.1", + "source-map": "^0.6.1", + "uglify-js": "^3.1.4" + } + }, "har-schema": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-2.0.0.tgz", @@ -4352,6 +4371,11 @@ "to-regex": "^3.0.1" } }, + "neo-async": { + "version": "2.6.1", + "resolved": "https://registry.npmjs.org/neo-async/-/neo-async-2.6.1.tgz", + "integrity": "sha512-iyam8fBuCUpWeKPGpaNMetEocMt364qkCsfL9JuhjXX6dRnguRVOfk2GZaDpPjcOKiiXCPINZC1GczQ7iTq3Zw==" + }, "nice-try": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz", @@ -4565,6 +4589,27 @@ "is-wsl": "^1.1.0" } }, + "optimist": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/optimist/-/optimist-0.6.1.tgz", + "integrity": "sha1-2j6nRob6IaGaERwybpDrFaAZZoY=", + "requires": { + "minimist": "~0.0.1", + "wordwrap": "~0.0.2" + }, + "dependencies": { + "minimist": { + "version": "0.0.10", + "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.10.tgz", + "integrity": "sha1-3j+YVD2/lggr5IrRoMfNqDYwHc8=" + }, + "wordwrap": { + "version": "0.0.3", + "resolved": "https://registry.npmjs.org/wordwrap/-/wordwrap-0.0.3.tgz", + "integrity": "sha1-o9XabNXAvAAI03I0u68b7WMFkQc=" + } + } + }, "optionator": { "version": "0.8.2", "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.8.2.tgz", @@ -6339,6 +6384,16 @@ "resolved": "https://registry.npmjs.org/typescript/-/typescript-3.5.2.tgz", "integrity": "sha512-7KxJovlYhTX5RaRbUdkAXN1KUZ8PwWlTzQdHV6xNqvuFOs7+WBo10TQUqT19Q/Jz2hk5v9TQDIhyLhhJY4p5AA==" }, + "uglify-js": { + "version": "3.6.0", + "resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-3.6.0.tgz", + "integrity": "sha512-W+jrUHJr3DXKhrsS7NUVxn3zqMOFn0hL/Ei6v0anCIMoKC93TjcflTagwIHLW7SfMFfiQuktQyFVCFHGUE0+yg==", + "optional": true, + "requires": { + "commander": "~2.20.0", + "source-map": "~0.6.1" + } + }, "uncss": { "version": "0.16.2", "resolved": "https://registry.npmjs.org/uncss/-/uncss-0.16.2.tgz", diff --git a/package.json b/package.json index 0833ad6..1d45bb0 100644 --- a/package.json +++ b/package.json @@ -17,11 +17,14 @@ "homepage": "https://github.com/RealOrangeOne/givemoneyto.me#readme", "dependencies": { "@fortawesome/fontawesome-free": "5.7.1", + "@types/mkdirp": "^0.5.2", "@types/node": "^12.0.10", "@types/parcel-bundler": "^1.12.0", "@types/rimraf": "^2.0.2", "animate.css": "3.7.0", "bootstrap": "4.2.1", + "handlebars": "^4.1.2", + "mkdirp": "^0.5.1", "parcel-bundler": "1.12.3", "rimraf": "^2.6.3", "sass": "^1.22.1", diff --git a/src/template.html b/src/template.html index b430036..7220e46 100644 --- a/src/template.html +++ b/src/template.html @@ -3,5 +3,6 @@ + {{ value }}