@changke/staticnext-build 0.1.0 → 0.2.1

package/CHANGELOG.md

@@ -4,6 +4,19 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+### 0.2.1
+2023-06-25
+### Changed
+- Updated `esbuild` to v0.18.9
+
+### 0.2.0
+2023-06-24
+### Changed
+- Better merging object supports nested object values
+### Added
+- Highlighting of code blocks in .md files
+- Quick support for generating XML file for RSS-URL
+
 ## 0.1.0
 2023-06-23
 ### Added

package/build.mjs

@@ -22,33 +22,36 @@ const taskEnded = taskName => {
   console.timeEnd(taskName);
 };
 
+const srcPaths = conf.getSourcePaths(conf.sourcePath, conf.sourceRoot);
+const tgtPaths = conf.getTargetPaths(conf.targetPath, conf.targetRoot, conf.targetAssetsRoot);
+
 // Set parameters of each task
 const tasks = {
   clean: () => clean([`${conf.targetRoot}/*`]),
   copy: () => copy([
     {sources: [`${conf.sourceRoot}/*`, `!${conf.sourceRoot}/*.d.ts`], target: conf.targetRoot},
-    {sources: `${conf.sourcePath.assets}/**/*`, target: conf.targetPath.assets},
-    {sources: `${conf.sourcePath.modules}/**/assets/**/*`, target: conf.targetPath.moduleAssets}
+    {sources: `${srcPaths.assets}/**/*`, target: tgtPaths.assets},
+    {sources: `${srcPaths.modules}/**/assets/**/*`, target: tgtPaths.moduleAssets}
   ]),
   markdown: () => markdown(
-    conf.sourcePath.markdown,
-    [conf.sourcePath.prototype, conf.sourcePath.modules],
+    srcPaths.markdown,
+    [srcPaths.prototype, srcPaths.modules],
     conf.njkGlobals,
-    conf.targetPath.markdown
+    tgtPaths.markdown
   ),
   prototype: () => prototype(
-    conf.sourcePath.prototype,
-    [conf.sourcePath.modules],
+    srcPaths.prototype,
+    [srcPaths.modules],
     conf.njkGlobals,
-    conf.targetPath.prototype
+    tgtPaths.prototype
   ),
-  scripts: () => scripts(conf.scriptEntries(conf.moduleEntries), conf.targetPath.assets),
+  scripts: () => scripts(conf.getScriptEntries(conf.moduleEntries, conf.mainEntryFile, srcPaths), tgtPaths.assets),
   styles: () => styles([
-    `${conf.sourcePath.css}/brands/*.css`,
-    `${conf.sourcePath.css}/index.css`,
-    `${conf.sourcePath.modules}/**/*.css`,
-    `!${conf.sourcePath.modules}/**/_*.css`
-  ], conf.targetPath.assets)
+    `${srcPaths.css}/brands/*.css`,
+    `${srcPaths.css}/index.css`,
+    `${srcPaths.modules}/**/*.css`,
+    `!${srcPaths.modules}/**/_*.css`
+  ], tgtPaths.assets)
 };
 
 const paraDev = () => {

package/lib/config.mjs

@@ -4,6 +4,7 @@ import vars from './vars.mjs';
 
 class Config {
   customConfigFile = '/sn-config.mjs';
+  objsToMerge = ['sourcePath', 'targetPath', 'njkGlobals'];
 
   async loadConfig(configFile) {
     const defaultConf = vars;
@@ -12,12 +13,27 @@ class Config {
       const cf = configFile || `${cwd()}${this.customConfigFile}`;
       const mod = await import(cf);
       const customConf = mod.default;
-      return Object.assign({}, defaultConf, customConf);
+      return this.deepMergeConfObj(defaultConf, customConf);
     } catch (e) {
       // file not exist
+      console.error('Error loading file: ', e);
       return defaultConf;
     }
   }
+
+  // keep nested obj values while merging
+  // e.g. {foo:{a:1,b:2}} merged with {foo:{b:3,c:4}} will be {foo:{a:1,b:3,c:4}}
+  deepMergeConfObj(defaultConf, customConf) {
+    const conf = Object.assign({}, defaultConf);
+    for (const [k, v] of Object.entries(customConf)) {
+      if (this.objsToMerge.includes(k)) {
+        conf[k] = Object.assign(conf[k], v);
+      } else {
+        conf[k] = v;
+      }
+    }
+    return conf;
+  }
 }
 
 const config = new Config();

package/lib/tasks/markdown.mjs

@@ -1,7 +1,9 @@
 import {globby} from 'globby';
 import {readFile} from 'node:fs/promises';
 import {marked} from 'marked';
+import {markedHighlight} from 'marked-highlight';
 import {markedXhtml} from 'marked-xhtml';
+import hljs from 'highlight.js';
 import njk from 'nunjucks';
 
 import {createAndWriteToFile, getTargetPathString} from '../utils.mjs';
@@ -9,7 +11,15 @@ import {createAndWriteToFile, getTargetPathString} from '../utils.mjs';
 marked.use({
   headerIds: false,
   mangle: false
-}, markedXhtml());
+},
+markedXhtml(),
+markedHighlight({
+  langPrefix: 'hljs language-',
+  highlight: (code, lang) => {
+    const language = hljs.getLanguage(lang) ? lang : 'plaintext';
+    return hljs.highlight(code, {language}).value;
+  }
+}));
 
 const {Environment, FileSystemLoader} = njk;
 

package/lib/tasks/prototype.mjs

@@ -30,7 +30,7 @@ const prototype = (prototypeSourcePathRoot, njkPaths, njkGlobals, prototypeTarge
         `${prototypeSourcePathRoot}/pages`,
         prototypeTargetPath,
         'njk',
-        'html'
+        page.endsWith('rss/index.njk') ? 'xml' : 'html' // special case for RSS
       );
       await createAndWriteToFile(targetFile, res);
     });

package/lib/vars.mjs

@@ -1,4 +1,8 @@
 /**
+ * Path(suffixes) for various source/target files
+ * E.g. CSS source files are located in `${basePath}/css`
+ * Built JS in `${targetAssetsBase}/js`
+ *
  * @typedef {Object} PathPart
  * @property {string} assets Path for general static assets
  * @property {string=} css Path for CSS files
@@ -11,22 +15,39 @@
  */
 
 /**
+ * Helper to create an array with input source TS files for esbuild
+ *
  * @typedef {Function} ScriptEntryFunc
- * @param {string[]} modEntries
- * @param {string=} mainEntry
+ * @param {string[]} modEntries Array of module entry TS files
+ * @param {string=} mainEntry Main entry TS file, default `main.ts`
+ * @param {PathPart} srcPaths
  * @return {string[]}
  */
 
+/**
+ * Helper to append base path to source/target path-suffixes
+ *
+ * @typedef {Function} GetPathFunc
+ *
+ * @param {PathPart} paths Path suffixes of various types e.g. `/css`, `/js`, `/md` (do with slash)
+ * @param {string} root Root path of source/target
+ * @param {string=} assetsRoot Only for target: assets root path e.g. `${targetRoot}/assets/_sn_`
+ * @return {PathPart}
+ */
+
 /**
  * @typedef {Object} SNConfig
  * @property {string} sourceRoot Root dir of source
  * @property {string} targetRoot Root dir for output (target)
  * @property {PathPart} sourcePath Paths of different types of source files
+ * @property {GetPathFunc} getSourcePaths
+ * @property {string} targetAssetsRoot
  * @property {PathPart} targetPath Paths for different output files
+ * @property {GetPathFunc} getTargetPaths
  * @property {string[]} tenants Theme-names
  * @property {string[]} moduleEntries List of input files of modules e.g. 'mod-foo/foo.ts'
  * @property {string} mainEntryFile The entry point of all JS e.g. main.ts
- * @property {ScriptEntryFunc} scriptEntries Inputs of source files for esbuild
+ * @property {ScriptEntryFunc} getScriptEntries Inputs of source files for esbuild
  * @property {string} assetsUrlPath Path of assets used in URL for resource loading etc.
  * @property {boolean} markdownEnabled Enable markdown feature or not
  * @property {Record<string, string>} njkGlobals Global variables assigned to Nunjucks compiler
@@ -40,38 +61,69 @@ const targetRoot = './tgt/static';
 
 /** @type {PathPart} */
 const sourcePath = {
-  assets: `${sourceRoot}/assets`,
-  css: `${sourceRoot}/css`,
-  js: `${sourceRoot}/js`,
-  modules: `${sourceRoot}/modules`,
-  prototype: `${sourceRoot}/prototype`,
-  test: `${sourceRoot}/test`,
-  markdown: `${sourceRoot}/md`
+  assets: '/assets',
+  css: '/css',
+  js: '/js',
+  modules: '/modules',
+  prototype: '/prototype',
+  test: '/test',
+  markdown: '/md'
+};
+
+/**
+ * Extend source paths
+ *
+ * @type {GetPathFunc}
+ */
+const getSourcePaths = (srcParts, srcRoot) => {
+  const sp = Object.assign({}, srcParts);
+  for (const [k, v] of Object.entries(sp)) {
+    sp[k] = `${srcRoot}${v}`; // extend path
+  }
+  return sp;
 };
 
-const targetAssetsRoot = `${targetRoot}/assets/_sn_`;
+const targetAssetsRoot = '/assets/_sn_';
+
 const targetPath = {
-  assets: targetAssetsRoot,
-  css: `${targetAssetsRoot}/css`,
-  js: `${targetAssetsRoot}/js`,
-  moduleAssets: `${targetAssetsRoot}/modules`,
-  prototype: `${targetRoot}/prototype`,
-  markdown: `${targetRoot}/docs`
+  assets: '',
+  css: '/css',
+  js: '/js',
+  moduleAssets: '/modules',
+  prototype: '/prototype',
+  markdown: '/docs'
+};
+
+/**
+ * Target paths
+ *
+ * @type {GetPathFunc}
+ */
+const getTargetPaths = (tgtPaths, tgtRoot = targetRoot, tgtAssetsRoot = targetAssetsRoot) => {
+  return {
+    assets: `${tgtRoot}${tgtAssetsRoot}`,
+    css: `${tgtRoot}${tgtAssetsRoot}${tgtPaths.css}`,
+    js: `${tgtRoot}${tgtAssetsRoot}${tgtPaths.js}`,
+    moduleAssets: `${tgtRoot}${tgtAssetsRoot}${tgtPaths.moduleAssets}`,
+    prototype: `${tgtRoot}${tgtPaths.prototype}`,
+    markdown: `${tgtRoot}${tgtPaths.markdown}`
+  };
 };
 
 // "themes", not in use, replaced with brands directory
 const tenants = ['one', 'two', 'three'];
 
-const mainEntryFile = `${sourcePath.js}/main.ts`;
+const mainEntryFile = 'main.ts';
 
 // also add the main entry file
 /** @type {ScriptEntryFunc} */
-const scriptEntries = (modEntries, mainEntry = mainEntryFile) => {
+const getScriptEntries = (modEntries, mainEntry = mainEntryFile, srcPaths) => {
+  const mainEntryPath = `${srcPaths.js}/${mainEntry}`;
   // For code splitting, as input config for esbuild
   const moduleEntryFiles = modEntries.map(f => {
-    return `${sourcePath.modules}/${f}`;
+    return `${srcPaths.modules}/${f}`;
   });
-  return [mainEntry].concat(moduleEntryFiles);
+  return [mainEntryPath].concat(moduleEntryFiles);
 };
 
 // To get relative path of assets
@@ -90,11 +142,14 @@ const config = {
   sourceRoot,
   targetRoot,
   sourcePath,
+  getSourcePaths,
+  targetAssetsRoot,
   targetPath,
+  getTargetPaths,
   tenants,
   moduleEntries,
   mainEntryFile,
-  scriptEntries,
+  getScriptEntries,
   assetsUrlPath,
   markdownEnabled,
   njkGlobals

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@changke/staticnext-build",
-  "version": "0.1.0",
+  "version": "0.2.1",
   "description": "Build scripts extracted from StaticNext seed project",
   "main": "index.js",
   "scripts": {
@@ -25,9 +25,11 @@
   "dependencies": {
     "cpy": "^10.1.0",
     "del": "^7.0.0",
-    "esbuild": "^0.18.6",
+    "esbuild": "^0.18.9",
     "globby": "^13.2.0",
+    "highlight.js": "^11.8.0",
     "marked": "^5.1.0",
+    "marked-highlight": "^2.0.1",
     "marked-xhtml": "^1.0.1",
     "nunjucks": "^3.2.4"
   }