Some pointers when transitioning from the HareScript Webdesign system to TypeScript page builders

General:

• onRenderPage takes the role of WebDesigns
• onRenderContent takes the role of bodyRenderer.objectName
• the content is rendered before the page is built, reversing HareScript's order.
  • ie in TypeScript, the static/dynamicpage cannot access its webdesign. (it actually triggers the webdesign by invoking render() on its ContentPageREquest)

Assets:

• avoid designroot/imgroot as they are specific to the selected webdesign and hurt component sharing. refer to /.wh/mod/<module>/public (mapped to mod::<module>/public/) instead
  • use getModulePublicAssetBase to get the URL for this folder, eg const imgroot = getModulePublicAssetBase("mymodule") + "img/";
• replace /.publisher/sd/<module>/example_site paths with /.wh/mod/<module>/public/ too

Main witty:

• htmlhead & htmlbody components become the parameters to req.render
• drop <meta name="viewport" from your head - modify req.pageMetaData.viewport if the defaults (width=device-width, initial-scale=1.0) aren't sufficient.

Automatic migrations:

• Update moduledefinition.xml and set webhareversion to the highest version you can. Some of the conversions/cleanup below may pick better syntax if the required version is high enough
• wh devkit:es2ts converts .es to .ts/.tsx files, adding eslint/typescript ignore directives where needed
• wh devkit:siteprl2yml converts XML to YML siteprofiles
  • siteprl2yml can also convert a single or group of siteprofiles, eg wh devkit:siteprl2yml <module> --mask <mask> --no-status-check. mask can be eg */nab.siteprl.xml
  • or simply dump a conversion without applying it, eg wh devkit:siteprl2yml <module> --mask <mask> --dump-yaml --dry-run.
• wh devkit:cleanupmodule cleans up XML and old loadlibs. It's not directly useful for TypeScript but cleaning up before XML to YML conversions and committing that first may reduces clutter in the actual conversion.