Add in content template
Unfortunately, parcel is a bit of a bitch, and tries to find `src/{{ image }}`, which sucks.
This commit is contained in:
parent
3541719aee
commit
7d30d1900a
GPG key ID:
57AFB45680EDD477
4 changed files with 53 additions and 4 deletions
15
index.ts
15
index.ts
|
|
@ -7,7 +7,7 @@ import Bundler from 'parcel-bundler';
|
|||
import { dirname, join } from 'path';
|
||||
import ProgressBar from 'progress';
|
||||
import rimraf from 'rimraf';
|
||||
import { range } from 'underscore';
|
||||
import { mapObject, range } from 'underscore';
|
||||
|
||||
interface Account {
|
||||
image: string;
|
||||
|
|
@ -29,6 +29,16 @@ const BUNDLER_OPTIONS = {
|
|||
minify: true,
|
||||
};
|
||||
|
||||
function readAccounts(): ReadonlyArray<Account> {
|
||||
const rawAccounts: Object = jsyaml.safeLoad(readFileSync(join(__dirname, 'accounts.yml')).toString());
|
||||
return Object.values(mapObject(rawAccounts, (val, key) => {
|
||||
return {
|
||||
...val,
|
||||
name: key
|
||||
};
|
||||
}));
|
||||
}
|
||||
|
||||
|
||||
function statusOutput(message: string) {
|
||||
console.log('> ' + message + '...');
|
||||
|
|
@ -52,10 +62,11 @@ function writeTemplate(
|
|||
rimraf.sync(BUILD_DIR);
|
||||
|
||||
statusOutput("Reading accounts")
|
||||
const accounts: ReadonlyArray<Account> = jsyaml.safeLoad(readFileSync(join(__dirname, 'accounts.yml')).toString());
|
||||
const accounts = readAccounts();
|
||||
|
||||
statusOutput('Creating template');
|
||||
const bundler = new Bundler(join(SRC_DIR, 'template.html'), BUNDLER_OPTIONS);
|
||||
console.log((bundler as any));
|
||||
await bundler.bundle();
|
||||
|
||||
statusOutput('Compiling HTML template');
|
||||
|
|
|
|||
10
package-lock.json
generated
10
package-lock.json
generated
|
|
@ -4001,6 +4001,11 @@
|
|||
"resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
|
||||
"integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo="
|
||||
},
|
||||
"jquery": {
|
||||
"version": "3.4.1",
|
||||
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.4.1.tgz",
|
||||
"integrity": "sha512-36+AdBzCL+y6qjw5Tx7HgzeGCzC81MDDgaUP8ld2zhx58HdqXGoBd+tHdrBMiyjGQs0Hxs/MLZTu/eHNJJuWPw=="
|
||||
},
|
||||
"js-beautify": {
|
||||
"version": "1.10.0",
|
||||
"resolved": "https://registry.npmjs.org/js-beautify/-/js-beautify-1.10.0.tgz",
|
||||
|
|
@ -4836,6 +4841,11 @@
|
|||
"resolved": "https://registry.npmjs.org/pn/-/pn-1.1.0.tgz",
|
||||
"integrity": "sha512-2qHaIQr2VLRFoxe2nASzsV6ef4yOOH+Fi9FBOVH6cqeSgUnoyySPZkxzLuzd+RYOQTRpROA0ztTMqxROKSb/nA=="
|
||||
},
|
||||
"popper.js": {
|
||||
"version": "1.15.0",
|
||||
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.15.0.tgz",
|
||||
"integrity": "sha512-w010cY1oCUmI+9KwwlWki+r5jxKfTFDVoadl7MSrIujHU5MJ5OR6HTDj6Xo8aoR/QsA56x8jKjA59qGH4ELtrA=="
|
||||
},
|
||||
"posix-character-classes": {
|
||||
"version": "0.1.1",
|
||||
"resolved": "https://registry.npmjs.org/posix-character-classes/-/posix-character-classes-0.1.1.tgz",
|
||||
|
|
|
|||
|
|
@ -26,12 +26,14 @@
|
|||
"@types/rimraf": "^2.0.2",
|
||||
"@types/underscore": "^1.9.1",
|
||||
"animate.css": "3.7.0",
|
||||
"bootstrap": "4.2.1",
|
||||
"bootstrap": "^4.2.1",
|
||||
"glob": "^7.1.4",
|
||||
"handlebars": "^4.1.2",
|
||||
"jquery": "^3.4.1",
|
||||
"js-yaml": "^3.13.1",
|
||||
"mkdirp": "^0.5.1",
|
||||
"parcel-bundler": "1.12.3",
|
||||
"popper.js": "^1.15.0",
|
||||
"prettier": "^1.18.2",
|
||||
"progress": "^2.0.3",
|
||||
"rimraf": "^2.6.3",
|
||||
|
|
|
|||
|
|
@ -1,8 +1,34 @@
|
|||
<html>
|
||||
<head>
|
||||
<link rel="stylesheet" href="../node_modules/@fortawesome/fontawesome-free/scss/fontawesome.scss" />
|
||||
<link rel="stylesheet" href="../node_modules/animate.css/animate.min.css" />
|
||||
<link rel="stylesheet" href="./index.scss" />
|
||||
</head>
|
||||
<body>
|
||||
{{ value }}
|
||||
<div class="jumbotron mb-0 jumbotron-fluid text-center vertical-center">
|
||||
<div class="container">
|
||||
<h1 class="display-1"></h1>
|
||||
<p class="lead">You should give me money. Here's how:</p>
|
||||
<h1>
|
||||
<i class="fas fa-chevron-down mt-5 animated infinite slideInDown"></i>
|
||||
</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="jumbotron mb-0 jumbotron-fluid">
|
||||
<div class="container">
|
||||
<div class="card-deck">
|
||||
{{#list accounts }}
|
||||
<div class="card text-center mx-5">
|
||||
<a href="{{ link }}" class="colour-invert">
|
||||
<img src="{{ image }}" class="card-img-top my-3 mx-3" alt="{{ name }} logo" style="max-width:40%" />
|
||||
</a>
|
||||
</div>
|
||||
{{/list}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="../node_modules/bootstrap/js/src/index.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
|||
Reference in a new issue