Fix resetting transpilers

Author: Ives van Hoorne

packages/app/src/sandbox/compile.js

@@ -338,6 +338,9 @@ async function compile({
 
     if (isNewCombination && !firstLoad) {
       // Just reset the whole manager if it's a new combination
+      if (manager) {
+        manager.dispose();
+      }
       manager = null;
     }
     const t = Date.now();

packages/app/src/sandbox/eval/manager.js

@@ -795,6 +795,14 @@ export default class Manager {
     this.clearCache();
   }
 
+  dispose() {
+    if (this.preset) {
+      this.preset.transpilers.forEach(t => {
+        t.dispose();
+      });
+    }
+  }
+
   clearCache() {
     try {
       localforage.clear();

packages/app/src/sandbox/eval/transpilers/babel/index.js

@@ -1,4 +1,6 @@
 // @flow
+import BabelWorker from 'worker-loader?name=babel-transpiler.[hash].worker.js!./babel-worker.js';
+
 import getBabelConfig from './babel-parser';
 import WorkerTranspiler from '../worker-transpiler';
 import { type LoaderContext } from '../../transpiled-module';
@@ -12,16 +14,22 @@ class BabelTranspiler extends WorkerTranspiler {
   worker: Worker;
 
   constructor() {
-    super('babel-loader', null, 2, { hasFS: true });
+    super('babel-loader', BabelWorker, 2, { hasFS: true });
   }
 
+  startupWorkersInitialized = false;
+
   async getWorker() {
     while (typeof window.babelworkers === 'undefined') {
       await delay(50); // eslint-disable-line
     }
+
+    if (window.babelworkers.length === 0) {
+      return super.getWorker();
+    }
+
     // We set these up in startup.js.
-    const worker = window.babelworkers.pop();
-    return worker;
+    return window.babelworkers.pop();
   }
 
   doTranspilation(code: string, loaderContext: LoaderContext): Promise<void> {
@@ -44,7 +52,7 @@ class BabelTranspiler extends WorkerTranspiler {
           code,
           config: babelConfig,
           path,
-          loaderOptions: loaderContext.options,
+          loaderOptions: loaderContext.options || {},
 
           babelTranspilerOptions:
             loaderContext.options.configurations &&

packages/app/src/sandbox/eval/transpilers/index.js

@@ -23,6 +23,8 @@ export default class Transpiler {
   /* eslint-disable */
   initialize() {}
 
+  dispose() {}
+
   cleanModule(loaderContext: LoaderContext) {}
 
   doTranspilation(

packages/app/src/sandbox/eval/transpilers/worker-transpiler.js

@@ -84,6 +84,9 @@ export default class WorkerTranspiler extends Transpiler {
 
   dispose() {
     this.workers.forEach(w => w.terminate());
+    this.initialized = false;
+    this.tasks.length = 0;
+    this.workers.length = 0;
     this.idleWorkers.length = 0;
   }
 

packages/react-sandpack/stories/InTheWild.js

@@ -122,9 +122,6 @@ stories.addWithJSX('babel', () => (
       '/index.js': {
         code: `import React from 'react';`,
       },
-      '/babel-transpiler.json': {
-        code: `{ "babelURL": "https://ives.cool" }`,
-      },
       '/.babelrc': {
         code: JSON.stringify(
           {