diff --git a/src/codecs/generic/quality-option.tsx b/src/codecs/generic/quality-option.tsx
index ae124947..413ef331 100644
--- a/src/codecs/generic/quality-option.tsx
+++ b/src/codecs/generic/quality-option.tsx
@@ -1,6 +1,6 @@
 import { h, Component } from 'preact';
 import { bind } from '../../lib/initial-util';
-import * as style from '../../components/Options/style.scss';
+import * as style from '../../components/Options/style.module.scss';
 import Range from '../../components/range';
 
 interface EncodeOptions {
diff --git a/src/codecs/imagequant/options.tsx b/src/codecs/imagequant/options.tsx
index 3af660db..c82f5648 100644
--- a/src/codecs/imagequant/options.tsx
+++ b/src/codecs/imagequant/options.tsx
@@ -2,7 +2,7 @@ import { h, Component } from 'preact';
 import { bind } from '../../lib/initial-util';
 import { inputFieldValueAsNumber, konami, preventDefault } from '../../lib/util';
 import { QuantizeOptions } from './processor-meta';
-import * as style from '../../components/Options/style.scss';
+import * as style from '../../components/Options/style.module.scss';
 import Expander from '../../components/expander';
 import Select from '../../components/select';
 import Range from '../../components/range';
diff --git a/src/codecs/mozjpeg/options.tsx b/src/codecs/mozjpeg/options.tsx
index 0cd4722f..2dad773b 100644
--- a/src/codecs/mozjpeg/options.tsx
+++ b/src/codecs/mozjpeg/options.tsx
@@ -2,7 +2,7 @@ import { h, Component } from 'preact';
 import { bind } from '../../lib/initial-util';
 import { inputFieldChecked, inputFieldValueAsNumber, preventDefault } from '../../lib/util';
 import { EncodeOptions, MozJpegColorSpace } from './encoder-meta';
-import * as style from '../../components/Options/style.scss';
+import * as style from '../../components/Options/style.module.scss';
 import Checkbox from '../../components/checkbox';
 import Expander from '../../components/expander';
 import Select from '../../components/select';
diff --git a/src/codecs/oxipng/options.tsx b/src/codecs/oxipng/options.tsx
index 99ebef61..68bc12cc 100644
--- a/src/codecs/oxipng/options.tsx
+++ b/src/codecs/oxipng/options.tsx
@@ -3,7 +3,7 @@ import { bind } from '../../lib/initial-util';
 import { inputFieldValueAsNumber, preventDefault } from '../../lib/util';
 import { EncodeOptions } from './encoder-meta';
 import Range from '../../components/range';
-import * as style from '../../components/Options/style.scss';
+import * as style from '../../components/Options/style.module.scss';
 
 type Props = {
   options: EncodeOptions;
diff --git a/src/codecs/resize/options.tsx b/src/codecs/resize/options.tsx
index 624b46a0..9b45fd25 100644
--- a/src/codecs/resize/options.tsx
+++ b/src/codecs/resize/options.tsx
@@ -5,7 +5,7 @@ import {
   inputFieldValueAsNumber, inputFieldValue, preventDefault, inputFieldChecked,
 } from '../../lib/util';
 import { ResizeOptions, isWorkerOptions } from './processor-meta';
-import * as style from '../../components/Options/style.scss';
+import * as style from '../../components/Options/style.module.scss';
 import Checkbox from '../../components/checkbox';
 import Expander from '../../components/expander';
 import Select from '../../components/select';
diff --git a/src/codecs/webp/options.tsx b/src/codecs/webp/options.tsx
index 81ba8dbe..cb05597e 100644
--- a/src/codecs/webp/options.tsx
+++ b/src/codecs/webp/options.tsx
@@ -2,7 +2,7 @@ import { h, Component } from 'preact';
 import { bind } from '../../lib/initial-util';
 import { inputFieldCheckedAsNumber, inputFieldValueAsNumber, preventDefault } from '../../lib/util';
 import { EncodeOptions, WebPImageHint } from './encoder-meta';
-import * as style from '../../components/Options/style.scss';
+import * as style from '../../components/Options/style.module.scss';
 import Checkbox from '../../components/checkbox';
 import Expander from '../../components/expander';
 import Select from '../../components/select';
diff --git a/src/components/App/index.tsx b/src/components/App/index.tsx
index 46b8313c..0e0b2fce 100644
--- a/src/components/App/index.tsx
+++ b/src/components/App/index.tsx
@@ -1,7 +1,7 @@
 import { h, Component } from 'preact';
 
 import { bind, linkRef, Fileish } from '../../lib/initial-util';
-import * as style from './style.scss';
+import * as style from './style.module.scss';
 import { FileDropEvent } from 'file-drop-element';
 import 'file-drop-element';
 import SnackBarElement, { SnackOptions } from '../../lib/SnackBar';
@@ -12,11 +12,9 @@ import '../custom-els/LoadingSpinner';
 const ROUTE_EDITOR = '/editor';
 
 const compressPromise = import(
-  /* webpackChunkName: "main-app" */
   '../compress');
 
 const swBridgePromise = import(
-  /* webpackChunkName: "sw-bridge" */
   '../../lib/sw-bridge');
 
 function back() {
@@ -47,8 +45,9 @@ export default class App extends Component<Props, State> {
 
     compressPromise.then((module) => {
       this.setState({ Compress: module.default });
-    }).catch(() => {
+    }).catch((e) => {
       this.showSnack('Failed to load app');
+      throw e;
     });
 
     swBridgePromise.then(async ({ offliner, getSharedImage }) => {
diff --git a/src/components/App/style.scss b/src/components/App/style.module.scss
similarity index 100%
rename from src/components/App/style.scss
rename to src/components/App/style.module.scss
diff --git a/src/components/Options/index.tsx b/src/components/Options/index.tsx
index 94fb9389..c8ec1c7f 100644
--- a/src/components/Options/index.tsx
+++ b/src/components/Options/index.tsx
@@ -1,6 +1,6 @@
 import { h, Component } from 'preact';
 
-import * as style from './style.scss';
+import * as style from './style.module.scss';
 import { bind } from '../../lib/initial-util';
 import { cleanSet, cleanMerge } from '../../lib/clean-modify';
 import OxiPNGEncoderOptions from '../../codecs/oxipng/options';
diff --git a/src/components/Options/style.scss b/src/components/Options/style.module.scss
similarity index 100%
rename from src/components/Options/style.scss
rename to src/components/Options/style.module.scss
diff --git a/src/components/Output/custom-els/TwoUp/index.ts b/src/components/Output/custom-els/TwoUp/index.ts
index 3c8c566e..19ac4bb1 100644
--- a/src/components/Output/custom-els/TwoUp/index.ts
+++ b/src/components/Output/custom-els/TwoUp/index.ts
@@ -1,5 +1,5 @@
 import PointerTracker, { Pointer } from 'pointer-tracker';
-import * as styles from './styles.css';
+import * as styles from './styles.module.css';
 
 const legacyClipCompatAttr = 'legacy-clip-compat';
 const orientationAttr = 'orientation';
diff --git a/src/components/Output/custom-els/TwoUp/styles.css b/src/components/Output/custom-els/TwoUp/styles.module.css
similarity index 100%
rename from src/components/Output/custom-els/TwoUp/styles.css
rename to src/components/Output/custom-els/TwoUp/styles.module.css
diff --git a/src/components/Output/index.tsx b/src/components/Output/index.tsx
index 36ba4120..753373c7 100644
--- a/src/components/Output/index.tsx
+++ b/src/components/Output/index.tsx
@@ -2,7 +2,7 @@ import { h, Component } from 'preact';
 import PinchZoom, { ScaleToOpts } from './custom-els/PinchZoom';
 import './custom-els/PinchZoom';
 import './custom-els/TwoUp';
-import * as style from './style.scss';
+import * as style from './style.module.scss';
 import { bind, linkRef } from '../../lib/initial-util';
 import { shallowEqual, drawDataToCanvas } from '../../lib/util';
 import {
@@ -13,7 +13,7 @@ import {
     ToggleBackgroundActiveIcon,
     RotateIcon,
 } from '../../lib/icons';
-import { twoUpHandle } from './custom-els/TwoUp/styles.css';
+import { twoUpHandle } from './custom-els/TwoUp/styles.module.css';
 import { InputProcessorState } from '../../codecs/input-processors';
 import { cleanSet } from '../../lib/clean-modify';
 import { SourceImage } from '../compress';
diff --git a/src/components/Output/style.scss b/src/components/Output/style.module.scss
similarity index 100%
rename from src/components/Output/style.scss
rename to src/components/Output/style.module.scss
diff --git a/src/components/checkbox/index.tsx b/src/components/checkbox/index.tsx
index 9ed202ab..b007c4d0 100644
--- a/src/components/checkbox/index.tsx
+++ b/src/components/checkbox/index.tsx
@@ -1,5 +1,5 @@
 import { h, Component } from 'preact';
-import * as style from './style.scss';
+import * as style from './style.module.scss';
 import { UncheckedIcon, CheckedIcon } from '../../lib/icons';
 
 interface Props extends JSX.HTMLAttributes {}
diff --git a/src/components/checkbox/style.scss b/src/components/checkbox/style.module.scss
similarity index 100%
rename from src/components/checkbox/style.scss
rename to src/components/checkbox/style.module.scss
diff --git a/src/components/compress/custom-els/MultiPanel/index.ts b/src/components/compress/custom-els/MultiPanel/index.ts
index 9e8081c7..79076fe9 100644
--- a/src/components/compress/custom-els/MultiPanel/index.ts
+++ b/src/components/compress/custom-els/MultiPanel/index.ts
@@ -1,4 +1,4 @@
-import * as style from './styles.css';
+import * as style from './styles.module.css';
 import { transitionHeight } from '../../../../lib/util';
 
 interface CloseAllOptions {
diff --git a/src/components/compress/custom-els/MultiPanel/styles.css b/src/components/compress/custom-els/MultiPanel/styles.module.css
similarity index 100%
rename from src/components/compress/custom-els/MultiPanel/styles.css
rename to src/components/compress/custom-els/MultiPanel/styles.module.css
diff --git a/src/components/compress/index.tsx b/src/components/compress/index.tsx
index ea91dbda..cfcdb1df 100644
--- a/src/components/compress/index.tsx
+++ b/src/components/compress/index.tsx
@@ -2,7 +2,7 @@ import { h, Component } from 'preact';
 
 import { bind, Fileish } from '../../lib/initial-util';
 import { blobToImg, drawableToImageData, blobToText } from '../../lib/util';
-import * as style from './style.scss';
+import * as style from './style.module.scss';
 import Output from '../Output';
 import Options from '../Options';
 import ResultCache from './result-cache';
diff --git a/src/components/compress/style.scss b/src/components/compress/style.module.scss
similarity index 100%
rename from src/components/compress/style.scss
rename to src/components/compress/style.module.scss
diff --git a/src/components/custom-els/LoadingSpinner/index.ts b/src/components/custom-els/LoadingSpinner/index.ts
index 843b1b65..b3e8ce30 100644
--- a/src/components/custom-els/LoadingSpinner/index.ts
+++ b/src/components/custom-els/LoadingSpinner/index.ts
@@ -1,4 +1,4 @@
-import * as styles from './styles.css';
+import * as styles from './styles.module.css';
 
 /**
  * A simple spinner. This custom element has no JS API. Just put it in the document, and it'll
diff --git a/src/components/custom-els/LoadingSpinner/styles.css b/src/components/custom-els/LoadingSpinner/styles.module.css
similarity index 100%
rename from src/components/custom-els/LoadingSpinner/styles.css
rename to src/components/custom-els/LoadingSpinner/styles.module.css
diff --git a/src/components/expander/index.tsx b/src/components/expander/index.tsx
index 8099937a..a2695dc2 100644
--- a/src/components/expander/index.tsx
+++ b/src/components/expander/index.tsx
@@ -1,5 +1,5 @@
 import { h, Component, ComponentChild, ComponentChildren } from 'preact';
-import * as style from './style.scss';
+import * as style from './style.module.scss';
 import { transitionHeight } from '../../lib/util';
 
 interface Props {
diff --git a/src/components/expander/style.scss b/src/components/expander/style.module.scss
similarity index 100%
rename from src/components/expander/style.scss
rename to src/components/expander/style.module.scss
diff --git a/src/components/intro/index.tsx b/src/components/intro/index.tsx
index 3439d309..f0562deb 100644
--- a/src/components/intro/index.tsx
+++ b/src/components/intro/index.tsx
@@ -3,15 +3,15 @@ import { h, Component } from 'preact';
 import { bind, linkRef, Fileish } from '../../lib/initial-util';
 import '../custom-els/LoadingSpinner';
 
-import logo from './imgs/logo.svg';
-import largePhoto from './imgs/demos/demo-large-photo.jpg';
-import artwork from './imgs/demos/demo-artwork.jpg';
-import deviceScreen from './imgs/demos/demo-device-screen.png';
-import largePhotoIcon from './imgs/demos/icon-demo-large-photo.jpg';
-import artworkIcon from './imgs/demos/icon-demo-artwork.jpg';
-import deviceScreenIcon from './imgs/demos/icon-demo-device-screen.jpg';
-import logoIcon from './imgs/demos/icon-demo-logo.png';
-import * as style from './style.scss';
+import logo from 'url:./imgs/logo.svg';
+import largePhoto from 'url:./imgs/demos/demo-large-photo.jpg';
+import artwork from 'url:./imgs/demos/demo-artwork.jpg';
+import deviceScreen from 'url:./imgs/demos/demo-device-screen.png';
+import largePhotoIcon from 'url:./imgs/demos/icon-demo-large-photo.jpg';
+import artworkIcon from 'url:./imgs/demos/icon-demo-artwork.jpg';
+import deviceScreenIcon from 'url:./imgs/demos/icon-demo-device-screen.jpg';
+import logoIcon from 'url:./imgs/demos/icon-demo-logo.png';
+import * as style from './style.module.scss';
 import SnackBarElement from '../../lib/SnackBar';
 
 const demos = [
diff --git a/src/components/intro/style.scss b/src/components/intro/style.module.scss
similarity index 100%
rename from src/components/intro/style.scss
rename to src/components/intro/style.module.scss
diff --git a/src/components/range/index.tsx b/src/components/range/index.tsx
index 0d69511a..20508af4 100644
--- a/src/components/range/index.tsx
+++ b/src/components/range/index.tsx
@@ -1,5 +1,5 @@
 import { h, Component } from 'preact';
-import * as style from './style.scss';
+import * as style from './style.module.scss';
 import RangeInputElement from '../../custom-els/RangeInput';
 import '../../custom-els/RangeInput';
 import { linkRef, bind } from '../../lib/initial-util';
diff --git a/src/components/range/style.scss b/src/components/range/style.module.scss
similarity index 100%
rename from src/components/range/style.scss
rename to src/components/range/style.module.scss
diff --git a/src/components/results/FileSize.tsx b/src/components/results/FileSize.tsx
index 9355882a..0f7f4296 100644
--- a/src/components/results/FileSize.tsx
+++ b/src/components/results/FileSize.tsx
@@ -1,6 +1,6 @@
 import { h, Component } from 'preact';
-import * as prettyBytes from 'pretty-bytes';
-import * as style from './style.scss';
+import prettyBytes from 'pretty-bytes';
+import * as style from './style.module.scss';
 
 interface Props {
   blob: Blob;
diff --git a/src/components/results/index.tsx b/src/components/results/index.tsx
index 1886ae5b..dcc67d46 100644
--- a/src/components/results/index.tsx
+++ b/src/components/results/index.tsx
@@ -1,6 +1,6 @@
 import { h, Component, ComponentChildren, ComponentChild } from 'preact';
 
-import * as style from './style.scss';
+import * as style from './style.module.scss';
 import FileSize from './FileSize';
 import { DownloadIcon, CopyAcrossIcon, CopyAcrossIconProps } from '../../lib/icons';
 import '../custom-els/LoadingSpinner';
diff --git a/src/components/results/style.scss b/src/components/results/style.module.scss
similarity index 100%
rename from src/components/results/style.scss
rename to src/components/results/style.module.scss
diff --git a/src/components/select/index.tsx b/src/components/select/index.tsx
index d9cc9abc..98141ebd 100644
--- a/src/components/select/index.tsx
+++ b/src/components/select/index.tsx
@@ -1,5 +1,5 @@
 import { h, Component } from 'preact';
-import * as style from './style.scss';
+import * as style from './style.module.scss';
 
 interface Props extends JSX.HTMLAttributes {
   large?: boolean;
diff --git a/src/components/select/style.scss b/src/components/select/style.module.scss
similarity index 100%
rename from src/components/select/style.scss
rename to src/components/select/style.module.scss
diff --git a/src/custom-els/RangeInput/index.ts b/src/custom-els/RangeInput/index.ts
index 838a24c5..4b40c231 100644
--- a/src/custom-els/RangeInput/index.ts
+++ b/src/custom-els/RangeInput/index.ts
@@ -1,6 +1,6 @@
 import PointerTracker from 'pointer-tracker';
 import { bind } from '../../lib/initial-util';
-import * as style from './styles.css';
+import * as style from './styles.module.css';
 
 const RETARGETED_EVENTS = ['focus', 'blur'];
 const UPDATE_EVENTS = ['input', 'change'];
diff --git a/src/custom-els/RangeInput/styles.css b/src/custom-els/RangeInput/styles.module.css
similarity index 100%
rename from src/custom-els/RangeInput/styles.css
rename to src/custom-els/RangeInput/styles.module.css
diff --git a/src/lib/SnackBar/index.ts b/src/lib/SnackBar/index.ts
index e790d7ab..025626a2 100644
--- a/src/lib/SnackBar/index.ts
+++ b/src/lib/SnackBar/index.ts
@@ -1,4 +1,4 @@
-import * as style from './styles.css';
+import * as style from './styles.module.css';
 
 export interface SnackOptions {
   timeout?: number;
diff --git a/src/lib/SnackBar/styles.css b/src/lib/SnackBar/styles.module.css
similarity index 100%
rename from src/lib/SnackBar/styles.css
rename to src/lib/SnackBar/styles.module.css