Fixup sdk.js deployment

src/components/App/client-api.ts

@@ -28,7 +28,8 @@ function addRemovableGlobalListener<
 }
 
 /**
- * The API class contains the methods that are exposed via Comlink to the outside world.
+ * The API class contains the methods that are exposed via Comlink to the
+ * outside world.
  */
 export class API {
   /**
@@ -39,7 +40,8 @@ export class API {
   /**
    * Loads a given file into Squoosh.
    * @param blob The `Blob` to load
-   * @param name The name of the file. The extension of this name will be used to deterime which decoder to use.
+   * @param name The name of the file. The extension of this name will be used
+   * to deterime which decoder to use.
    */
   async setFile(blob: Blob, name: string) {
     return new Promise((resolve) => {

src/sdk.ts

@@ -1,30 +1,37 @@
-import {proxy, ProxyResult} from "comlink";
+import { proxy, ProxyResult } from 'comlink';
 
-import {API, ReadyMessage} from "./components/App/client-api";
+import { API, ReadyMessage } from './components/App/client-api';
 
 /**
  * This function will load an iFrame
  * @param {HTMLIFrameElement} ifr iFrame that will be used to load squoosh
  * @param {string} src URL of squoosh instance to use
  */
-export default async function loader(ifr: HTMLIFrameElement, src: string = "https://squoosh.app"): Promise<ProxyResult<API>> {
+export default async function loader(
+  ifr: HTMLIFrameElement,
+  src: string = 'https://squoosh.app',
+): Promise<ProxyResult<API>> {
   ifr.src = src;
-  await new Promise(resolve => ifr.onload = resolve);
+  await new Promise(resolve => (ifr.onload = resolve));
-  ifr.contentWindow!.postMessage("READY?", "*");
+  ifr.contentWindow!.postMessage('READY?', '*');
-  await new Promise(resolve => {
+  await new Promise((resolve) => {
-    window.addEventListener("message", function l(ev) {
+    window.addEventListener('message', function l(ev) {
       const msg = ev.data as ReadyMessage;
-      if(!msg || msg.type !== "READY") {
+      if (!msg || msg.type !== 'READY') {
         return;
       }
-      if(msg.version !== MAJOR_VERSION) {
+      if (msg.version !== MAJOR_VERSION) {
-        throw Error(`Version mismatch. SDK version ${MAJOR_VERSION}, Squoosh version ${msg.version}`);
+        throw Error(
+          `Version mismatch. SDK version ${MAJOR_VERSION}, Squoosh version ${
+            msg.version
+          }`,
+        );
       }
       ev.stopPropagation();
-      window.removeEventListener("message", l);
+      window.removeEventListener('message', l);
       resolve();
     });
   });
 
   return proxy(ifr.contentWindow!);
-}
+}

webpack.config.js

@@ -44,7 +44,15 @@ module.exports = async function (_, env) {
     devtool: isProd ? 'source-map' : 'inline-source-map',
     stats: 'minimal',
     output: {
-      filename: isProd ? '[name].[chunkhash:5].js' : '[name].js',
+      filename: chunkData => {
+        if(chunkData.chunk.name === 'sdk') {
+          return 'sdk.js';
+        }
+        if(!isProd) {
+          return '[name].js';
+        }
+        return '[name].[chunkhash:5].js'
+      },
       chunkFilename: '[name].[chunkhash:5].js',
       path: path.join(__dirname, 'build'),
       publicPath: '/',