generator-white-label 3.2.0 → 5.0.0

package/scripts/build.ts

@@ -0,0 +1,175 @@
+/** Values injected into page templates and the generated config file. */
+export interface BuildConfig {cdn: string; production: boolean; service: string; version: string; www: string}
+import fs from 'node:fs/promises';
+import path from 'node:path';
+import {fileURLToPath} from 'node:url';
+import {build as buildJavaScript} from 'esbuild';
+import Handlebars from 'handlebars';
+import * as sass from 'sass';
+
+const defaultProjectRoot = path.resolve(path.dirname(fileURLToPath(import.meta.url)), '../..');
+
+/**
+ * Read deployment flags and reject version strings that contain path separators.
+ * @param argumentsList - Command-line arguments excluding the Node executable and script.
+ * @returns Deployment configuration with defaults for omitted flags.
+ * @throws When input does not satisfy the documented contract.
+ */
+export function parseArguments(argumentsList: string[]): BuildConfig {
+    const values = Object.fromEntries(argumentsList.map((argument) => {
+        const [key, ...value] = argument.replace(/^--/, '').split('=');
+        return [key, value.join('=')];
+    }));
+    const version = values.version || String(Math.floor(Date.now() / 1000));
+    if (!/^[A-Za-z0-9._-]+$/.test(version)) {
+        throw new Error('Version may contain only letters, numbers, dots, underscores, and hyphens');
+    }
+    return {
+        cdn: values.cdn || '/',
+        production: values.production === 'true',
+        service: values.service || '/service-endpoint',
+        version,
+        www: values.www || '/'
+    };
+}
+
+/**
+ * Recursively collect files below a directory, propagating filesystem failures.
+ * @param directory - Directory to traverse recursively.
+ * @returns A promise resolving to all descendant file paths.
+ */
+async function filesUnder(directory: string): Promise<string[]> {
+    const entries = await fs.readdir(directory, {withFileTypes: true});
+    const files = await Promise.all(entries.map(async (entry) => {
+        const location = path.join(directory, entry.name);
+        return entry.isDirectory() ? filesUnder(location) : [location];
+    }));
+    return files.flat();
+}
+
+/**
+ * Register partials and render pages using global, page-specific, and deployment data.
+ * @param config - Validated deployment or database configuration.
+ * @param outputRoot - Destination for rendered pages.
+ * @param projectRoot - Project containing app sources and installed dependencies.
+ * @returns A promise resolving after all pages have been written.
+ */
+async function renderMarkup(config: BuildConfig, outputRoot: string, projectRoot: string) {
+    const markupRoot = path.join(projectRoot, 'app/assets/markup');
+    for (const partialPath of await filesUnder(markupRoot)) {
+        if (/\.(hbs|handlebars)$/.test(partialPath)) {
+            const name = path.relative(markupRoot, partialPath).replace(/\\/g, '/').replace(/\.(hbs|handlebars)$/, '');
+            Handlebars.registerPartial(name, await fs.readFile(partialPath, 'utf8'));
+        }
+    }
+
+    const globalData = JSON.parse(await fs.readFile(
+        path.join(projectRoot, 'app/assets/data/view/global.json'), 'utf8'
+    ));
+    const pages = (await filesUnder(path.join(projectRoot, 'app')))
+        .filter((file) => file.endsWith('.hbs') && !file.includes(`${path.sep}assets${path.sep}`));
+
+    await Promise.all(pages.map(async (page) => {
+        const relative = path.relative(path.join(projectRoot, 'app'), page);
+        const pageDataPath = path.join(
+            projectRoot, 'app/assets/data/view', relative.replace(/\.hbs$/, '.json')
+        );
+        let pageData = {};
+        try {
+            pageData = JSON.parse(await fs.readFile(pageDataPath, 'utf8'));
+        } catch (error) {
+            if (!(error instanceof Error && 'code' in error && error.code === 'ENOENT')) {
+                throw error;
+            }
+        }
+        const template = Handlebars.compile(await fs.readFile(page, 'utf8'));
+        const destination = path.join(outputRoot, relative.replace(/\.hbs$/, '.html'));
+        await fs.mkdir(path.dirname(destination), {recursive: true});
+        await fs.writeFile(destination, template({...globalData, ...pageData, ...config}));
+    }));
+}
+
+/**
+ * Compile project Sass and include the full published Bootstrap stylesheet.
+ * @param outputAssets - Destination for compiled asset directories.
+ * @param production - Enable compressed output and omit development source maps.
+ * @param projectRoot - Project containing app sources and installed dependencies.
+ * @returns A promise resolving after all stylesheets have been written.
+ */
+async function compileStyles(outputAssets: string, production: boolean, projectRoot: string) {
+    const styleRoot = path.join(projectRoot, 'app/assets/style');
+    await Promise.all(['global', 'print', 'toolkit'].map(async (name) => {
+        const result = sass.compile(path.join(styleRoot, `${name}.scss`), {
+            loadPaths: [path.join(projectRoot, 'node_modules')],
+            style: production ? 'compressed' : 'expanded'
+        });
+        const destination = path.join(outputAssets, 'style', `${name}.css`);
+        await fs.mkdir(path.dirname(destination), {recursive: true});
+        // Bootstrap publishes compiled CSS, so consuming it avoids recompiling third-party
+        // Sass and keeps dependency deprecation warnings out of project builds.
+        const bootstrapSource = name === 'global'
+            ? (await fs.readFile(
+                path.join(projectRoot, 'node_modules/bootstrap/dist/css/bootstrap.css'), 'utf8'
+            )).replace(/\/\*# sourceMappingURL=bootstrap\.css\.map \*\//, '')
+            : '';
+        const bootstrapCss = production && bootstrapSource
+            ? sass.compileString(bootstrapSource, {style: 'compressed', syntax: 'css'}).css
+            : bootstrapSource;
+        await fs.writeFile(destination, `${bootstrapCss}${bootstrapCss ? '\n' : ''}${result.css}`);
+    }));
+}
+
+/**
+ * Bundle TypeScript entry points for browsers, excluding declaration-only files.
+ * @param outputAssets - Destination for compiled asset directories.
+ * @param production - Enable compressed output and omit development source maps.
+ * @param projectRoot - Project containing app sources and installed dependencies.
+ * @returns A promise resolving after all script bundles have been written.
+ */
+async function compileScripts(outputAssets: string, production: boolean, projectRoot: string) {
+    const scriptRoot = path.join(projectRoot, 'app/assets/script');
+    const entries = (await fs.readdir(scriptRoot, {withFileTypes: true}))
+        .filter((entry) => entry.isFile() && !entry.name.endsWith('.d.ts') && /\.tsx?$/.test(entry.name))
+        .map((entry) => path.join(scriptRoot, entry.name));
+    await fs.mkdir(path.join(outputAssets, 'script'), {recursive: true});
+    await buildJavaScript({
+        bundle: true,
+        entryNames: '[name].compiled',
+        entryPoints: entries,
+        format: 'iife',
+        loader: {'.ts': 'ts', '.tsx': 'tsx'},
+        minify: production,
+        outdir: path.join(outputAssets, 'script'),
+        sourcemap: !production,
+        target: ['es2018']
+    });
+    await fs.writeFile(path.join(outputAssets, 'script/global.compiled.js'), '');
+}
+
+/**
+ * Replace the project deployment directory with compiled pages, scripts, styles, and static assets.
+ * @param config - Validated deployment or database configuration.
+ * @param projectRoot - Project containing app sources and installed dependencies.
+ * @returns A promise resolving after the deployment directory has been rebuilt.
+ */
+export async function build(config = parseArguments(process.argv.slice(2)), projectRoot = defaultProjectRoot) {
+    const outputRoot = path.join(projectRoot, '_deploy');
+    const outputAssets = path.join(outputRoot, 'release', config.version, 'assets');
+    await fs.rm(outputRoot, {recursive: true, force: true});
+    await fs.mkdir(outputAssets, {recursive: true});
+
+    await Promise.all([
+        fs.cp(path.join(projectRoot, 'app/assets/data'), path.join(outputAssets, 'data'), {recursive: true}),
+        fs.cp(path.join(projectRoot, 'app/assets/font'), path.join(outputAssets, 'font'), {recursive: true}),
+        fs.cp(path.join(projectRoot, 'app/assets/image'), path.join(outputAssets, 'image'), {recursive: true})
+    ]);
+    await fs.writeFile(path.join(outputAssets, 'data/config.json'), JSON.stringify(config));
+    await renderMarkup(config, outputRoot, projectRoot);
+    await compileStyles(outputAssets, config.production, projectRoot);
+    await compileScripts(outputAssets, config.production, projectRoot);
+    await fs.copyFile(path.join(projectRoot, 'app/robots.txt'), path.join(outputRoot, 'robots.txt'));
+}
+
+if (path.resolve(process.argv[1] || '') === fileURLToPath(import.meta.url)) {
+    await build();
+}

package/tsconfig.site.json

@@ -0,0 +1,26 @@
+{
+  "compilerOptions": {
+    "target": "ES2022",
+    "module": "NodeNext",
+    "moduleResolution": "NodeNext",
+    "strict": true,
+    "esModuleInterop": true,
+    "declaration": true,
+    "sourceMap": true,
+    "inlineSources": true,
+    "outDir": "dist",
+    "rootDir": ".",
+    "jsx": "react-jsx",
+    "resolveJsonModule": true,
+    "types": [
+      "node",
+      "react"
+    ],
+    "noEmitOnError": true
+  },
+  "include": [
+    "scripts/**/*.ts",
+    "app/assets/script/**/*.ts",
+    "app/assets/script/**/*.tsx"
+  ]
+}

package/.babelrc

@@ -1,14 +0,0 @@
-{
-    "presets": [
-        "react",
-        ["env", {
-            "targets": {
-                "browsers": ["last 2 versions", "Firefox ESR", "Explorer 11"]
-            }
-        }]
-    ],
-    "plugins": [
-        "transform-es2015-modules-umd",
-        "transform-es2015-modules-commonjs"
-    ]
-}

package/.editorconfig

@@ -1,13 +0,0 @@
-# EditorConfig is awesome: http://EditorConfig.org
-
-root = true
-
-[*]
-end_of_line = lf
-insert_final_newline = true
-charset = utf-8
-indent_style = space
-indent_size = 4
-max_line_length = 120
-quote_type = single
-indent_brace_style = K&R

package/.eslintrc

@@ -1,64 +0,0 @@
-{
-    "env":{
-        "node":true,
-        "browser":true,
-        "jasmine":true,
-        "amd":true,
-        "es6":true
-    },
-    "extends":"eslint:recommended",
-    "globals":{
-    },
-    "plugins":[
-        "react"
-    ],
-    "parserOptions":{
-        "sourceType":"module",
-        "ecmaFeatures":{
-            "jsx": true
-        }
-    },
-    "rules":{
-        "no-console":1,
-        "curly":2,
-        "comma-dangle":[
-            2,
-            "never"
-        ],
-        "strict":[
-            0,
-            "function"
-        ],
-        "camelcase":[
-            2,
-            {
-                "properties":"always"
-            }
-        ],
-        "quotes":[
-            2,
-            "single"
-        ],
-        "no-multiple-empty-lines":2,
-        "space-before-function-paren":[
-            2,
-            "never"
-        ],
-        "indent":[
-            2,
-            4
-        ],
-        "max-len":[
-            2,
-            120,
-            4
-        ],
-        "max-params":[
-            2,
-            3
-        ],
-        "no-unused-vars":[
-            0
-        ]
-    }
-}

package/.htmllintrc

@@ -1,6 +0,0 @@
-{
-    "id-class-style": false,
-    "attr-name-style": false,
-    "attr-req-value": false,
-    "tag-close": false
-}

package/.sass-lint.yml

@@ -1,16 +0,0 @@
-# Linter Options
-options:
-    merge-default-rules: true
-
-# Rule Configuration
-rules:
-    force-attribute-nesting: 0
-    force-pseudo-nesting: 0
-    property-sort-order: 2
-    quotes: 2
-    indentation:
-        - 2
-        - size: 4
-    nesting-depth:
-        - 1
-        - max-depth: 5

package/.travis.yml

@@ -1,18 +0,0 @@
-language: node_js
-env:
-  - CXX=g++-4.8
-addons:
-    apt:
-        sources:
-            - ubuntu-toolchain-r-test
-        packages:
-            - g++-4.8
-node_js:
-    - 7
-    - 6
-    - 5
-    - 4
-before_script:
-    - npm install -g gulp-cli
-script:
-    - npm test

package/app/assets/font/opensans/generator_config.txt

@@ -1,5 +0,0 @@
-# Font Squirrel Font-face Generator Configuration File
-# Upload this file to the generator to recreate the settings
-# you used to create these fonts.
-
-{"mode":"optimal","formats":["ttf","woff","woff2","eotz"],"tt_instructor":"default","fix_gasp":"xy","fix_vertical_metrics":"Y","metrics_ascent":"","metrics_descent":"","metrics_linegap":"","add_spaces":"Y","add_hyphens":"Y","fallback":"none","fallback_custom":"100","options_subset":"basic","subset_custom":"","subset_custom_range":"","subset_ot_features_list":"","css_stylesheet":"stylesheet.css","filename_suffix":"-webfont","emsquare":"2048","spacing_adjustment":"0"}