preact cli into single html file

package.json

{
  "name": "preact single html",
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "build-single": "preact build --no-sw --no-esm -c preact.single-config.js --dest single && sh remove-link-stylesheet.sh",
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

preact.config.js

// nothing interesting here, just your usual development config
export default {}

preact.single-config.js

import defaultConfig from './preact.config'

export default {
  webpack(config, env, helpers, options) {
    defaultConfig.webpack(config, env, helpers, options)

    //1. check no file is under /routers or /component/{routers,async} to prevent async components
    // https://github.com/preactjs/preact-cli#route-based-code-splitting

    //2. remove devtools to prevent sourcemaps
    config.devtool = false

    //3. change assetLoader to load assets inline
    const loaders = helpers.getLoaders(config)
    const assetsLoader = loaders.find(lo => lo.rule.test.test('something.woff'))
    if (assetsLoader) {
      assetsLoader.rule.use = 'base64-inline-loader'
      assetsLoader.rule.loader = undefined
    }

    //4. remove critters
    //critters remove the css bundle from htmlWebpackPlugin.files.css
    //for now, pushing all the content into the html is enough
    const crittersWrapper = helpers.getPluginsByName(config, 'Critters')
    if (crittersWrapper && crittersWrapper.length > 0) {
      const [{ index }] = crittersWrapper
      config.plugins.splice(index, 1)
    }

    //5. remove favicon from src/assets

    //6. remove performance hints since we now that this is going to be big
    if (config.performance) {
      config.performance.hints = false
    }

    //7. template.html should have a favicon and add js/css content

    //last, after building remove the mysterious link to stylesheet with remove-link-stylesheet.sh
  }
}

remove-link-stylesheet.sh

# This script has been placed in the public domain.

FILE=$(ls single/bundle.*.css)
BUNDLE=${FILE#single}
grep -q '<link href="'$BUNDLE'" rel="stylesheet">' single/index.html || { echo bundle $BUNDLE not found in index.html; exit 1; }
echo -n Removing link from index.html ...
sed 's_<link href="'$BUNDLE'" rel="stylesheet">__' -i single/index.html
echo done