Sabaki: improve build size

[Terkwood]

Summary

There was lots of bloat after adding preact material components

Tasks

• Don't import all the preact-material-components JS

[Terkwood]

https://medium.com/@prateekbh/super-thin-material-components-for-your-preact-app-2b7da3e0700c

[Terkwood]

CSS import strategy seems basically OK. The CSS file we bundle is under 5K

https://stackoverflow.com/questions/48603752/how-to-use-select-in-preact-material-components

[Terkwood]

Sample

https://github.com/preactjs-templates/material?files=1

[Terkwood]

Try import like import Dialog from 'preact-material-components/Dialog';

https://material.preactjs.com/component/dialog/

[Terkwood]

Probably we aren't tree shaking. Try switching import strat

https://material-ui.com/guides/minimizing-bundle-size/

[Terkwood]

This isn't so straightforward. Using the recommended require syntax with ES5 doesn't work. Not sure if there's something we can do to the webpack config to make this right.

Ended up trying to reference a local file since webpack injected a path

Error: Module build failed: Error: ENOENT: no such file or directory, open '/PATH/TO/DEV/LOCAL/Sabaki/node_modules/process/browser.js'
``

[Terkwood]

Possible fix? webpack/webpack#2031 (comment)

[Terkwood]

https://webpack.js.org/configuration/module/#ruleexclude

[Terkwood]

Resolved