Making JavaScript functionality changes

By Craig Buckler

181 words, 1-minute read

machine
Image courtesy of Mike Hindle

This theme’s client-side JavaScript files are managed by Publican rather than a third-party bundler such as esbuild or Rollup. JS files are contained in src/content/js/ and mostly copied as-is – although you could insert jsTACS ${ expressions } if required.

main.js #

main.js is the root entry script which imports others from the lib sub-directory:

You can add, remove, or rearrange JavaScript files as necessary.

The template partial src/template/_partials/htmlhead.html sets a Content Security Policy in the HTML <head>. You may need to update the <meta> tag if you load resources from third-party domains.

Note that JavaScript is not configured to be hot-reloaded. You must manually refresh the browser when a change is made.

Template literals #

Template literals intended for runtime processing must use !{ expressions } to ensure jsTACS errors are not triggered during the build, e.g.

const name = 'Craig';
console.log(`Hello !{ name }`);