<p dir="auto"><a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/kitsonk/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/kitsonk">@kitsonk</a> <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/ry/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/ry">@ry</a> <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/bartlomieju/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/bartlomieju">@bartlomieju</a> submitting a separate issue brought up by <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="/users/base698/hovercard" data-octo-click="hovercard-link-click" data-octo-dimensions="link_type:self" href="https://github.com/base698">@base698</a> in <a class="issue-link js-issue-link" data-error-text="Failed to load title" data-id="557482381" data-permission-text="Title is private" data-url="https://github.com/denoland/deno/issues/3828" data-hovercard-type="pull_request" data-hovercard-url="/denoland/deno/pull/3828/hovercard" href="https://github.com/denoland/deno/pull/3828">#3828</a></p>
<p dir="auto">worker.ts</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="function entryPoint(data) {
   console.log('received');
   postMessage(&quot;Hi 2 u&quot;);
}

if (self.name !== &quot;workerFn&quot;) throw Error(&quot;Bad name&quot;);

onmessage = function(e) {
    entryPoint(e.data);
}

onerror = function(err) {
    console.error('on error', err);
    return false;
}"><pre class="notranslate"><code class="notranslate">function entryPoint(data) {
   console.log('received');
   postMessage("Hi 2 u");
}

if (self.name !== "workerFn") throw Error("Bad name");

onmessage = function(e) {
    entryPoint(e.data);
}

onerror = function(err) {
    console.error('on error', err);
    return false;
}
</code></pre></div>
<p dir="auto">01_worker.ts</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="var [diagnostics, emit] = await Deno.bundle('./worker.ts');
const encoder = new TextEncoder();
Deno.writeFileSync('./worker.js', encoder.encode(emit));

const workerFn = new Worker('./worker.js', { name: 'workerFn', type: &quot;module&quot; });
workerFn.onmessage = console.log;

workerFn.postMessage('from client');"><pre class="notranslate"><code class="notranslate">var [diagnostics, emit] = await Deno.bundle('./worker.ts');
const encoder = new TextEncoder();
Deno.writeFileSync('./worker.js', encoder.encode(emit));

const workerFn = new Worker('./worker.js', { name: 'workerFn', type: "module" });
workerFn.onmessage = console.log;

workerFn.postMessage('from client');
</code></pre></div>
<p dir="auto"><strong>Deno 0.32</strong></p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="$ deno --allow-write 01_worker.ts
received
{ data: &quot;Hi 2 u&quot; }"><pre class="notranslate"><code class="notranslate">$ deno --allow-write 01_worker.ts
received
{ data: "Hi 2 u" }
</code></pre></div>
<p dir="auto"><strong>Deno 0.33</strong></p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="$ deno --allow-write 01_worker.ts
Compile file:///home/justin/workspaces/deno-test/tests/01_worker.ts
error: Uncaught Error: Uncaught TypeError: Cannot destructure property 'deps' of 'mMap.get(...)' as it is undefined.
$deno$/workers.ts:169:17
    at poll ($deno$/workers.ts:169:17)"><pre class="notranslate"><code class="notranslate">$ deno --allow-write 01_worker.ts
Compile file:///home/justin/workspaces/deno-test/tests/01_worker.ts
error: Uncaught Error: Uncaught TypeError: Cannot destructure property 'deps' of 'mMap.get(...)' as it is undefined.
$deno$/workers.ts:169:17
    at poll ($deno$/workers.ts:169:17)
</code></pre></div>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="deno 0.33.0
v8 8.1.108
typescript 3.7.2"><pre class="notranslate"><code class="notranslate">deno 0.33.0
v8 8.1.108
typescript 3.7.2
</code></pre></div>
<p dir="auto">I tried to bundle a file with content code:<br>
<code class="notranslate">console.log('Hello from Deno!');</code></p>
<p dir="auto">to bundle: <code class="notranslate">deno bundle app.ts bundle.js</code></p>
<p dir="auto">it generated :</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="// Copyright 2018-2020 the Deno authors. All rights reserved. MIT license.

// This is a specialised implementation of a System module loader.

// eslint-disable-next-line @typescript-eslint/no-unused-vars
let System;
let __inst;

(() =&gt; {
  const mMap = new Map();
  System = {
    register(id, deps, f) {
      mMap.set(id, {
        id,
        deps,
        f,
        exp: {}
      });
    }
  };

  const gC = (data, main) =&gt; {
    const { id } = data;
    return {
      id,
      import: async id =&gt; mMap.get(id)?.exp,
      meta: { url: id, main }
    };
  };

  const gE = data =&gt; {
    const { exp } = data;
    return (id, value) =&gt; {
      const values = typeof id === &quot;string&quot; ? { [id]: value } : id;
      for (const [id, value] of Object.entries(values)) {
        Object.defineProperty(exp, id, {
          value,
          writable: true,
          enumerable: true
        });
      }
    };
  };

  const iQ = [];

  const enq = ids =&gt; {
    for (const id of ids) {
      if (!iQ.includes(id)) {
        const { deps } = mMap.get(id);
        iQ.push(id);
        enq(deps);
      }
    }
  };

  const dr = async main =&gt; {
    const rQ = [];
    let id;
    while ((id = iQ.pop())) {
      const m = mMap.get(id);
      const { f } = m;
      if (!f) {
        return;
      }
      rQ.push([m.deps, f(gE(m), gC(m, id === main))]);
      m.f = undefined;
    }
    let r;
    while ((r = rQ.shift())) {
      const [deps, { execute, setters }] = r;
      for (let i = 0; i &lt; deps.length; i++) setters[i](mMap.get(deps[i])?.exp);
      const e = execute();
      if (e) await e;
    }
  };

  __inst = async id =&gt; {
    System = undefined;
    __inst = undefined;
    enq([id]);
    await dr(id);
    return mMap.get(id)?.exp;
  };
})();

console.log('Hello from Deno!');

await __inst(&quot;file:///C:/Users/SOstad/Projects/tests/deno01/src/app&quot;);"><pre class="notranslate"><code class="notranslate">// Copyright 2018-2020 the Deno authors. All rights reserved. MIT license.

// This is a specialised implementation of a System module loader.

// eslint-disable-next-line @typescript-eslint/no-unused-vars
let System;
let __inst;

(() =&gt; {
  const mMap = new Map();
  System = {
    register(id, deps, f) {
      mMap.set(id, {
        id,
        deps,
        f,
        exp: {}
      });
    }
  };

  const gC = (data, main) =&gt; {
    const { id } = data;
    return {
      id,
      import: async id =&gt; mMap.get(id)?.exp,
      meta: { url: id, main }
    };
  };

  const gE = data =&gt; {
    const { exp } = data;
    return (id, value) =&gt; {
      const values = typeof id === "string" ? { [id]: value } : id;
      for (const [id, value] of Object.entries(values)) {
        Object.defineProperty(exp, id, {
          value,
          writable: true,
          enumerable: true
        });
      }
    };
  };

  const iQ = [];

  const enq = ids =&gt; {
    for (const id of ids) {
      if (!iQ.includes(id)) {
        const { deps } = mMap.get(id);
        iQ.push(id);
        enq(deps);
      }
    }
  };

  const dr = async main =&gt; {
    const rQ = [];
    let id;
    while ((id = iQ.pop())) {
      const m = mMap.get(id);
      const { f } = m;
      if (!f) {
        return;
      }
      rQ.push([m.deps, f(gE(m), gC(m, id === main))]);
      m.f = undefined;
    }
    let r;
    while ((r = rQ.shift())) {
      const [deps, { execute, setters }] = r;
      for (let i = 0; i &lt; deps.length; i++) setters[i](mMap.get(deps[i])?.exp);
      const e = execute();
      if (e) await e;
    }
  };

  __inst = async id =&gt; {
    System = undefined;
    __inst = undefined;
    enq([id]);
    await dr(id);
    return mMap.get(id)?.exp;
  };
})();

console.log('Hello from Deno!');

await __inst("file:///C:/Users/SOstad/Projects/tests/deno01/src/app");
</code></pre></div>
<p dir="auto">after I run it with <code class="notranslate">deno run bundle.js</code> here is the error:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="error: Uncaught TypeError: Cannot destructure property 'deps' of 'mMap.get(...)' as it is 
undefined."><pre class="notranslate"><code class="notranslate">error: Uncaught TypeError: Cannot destructure property 'deps' of 'mMap.get(...)' as it is 
undefined.
</code></pre></div>
<p dir="auto">also Docs for bundle is outdated:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="Bundling

deno bundle [URL] will output a single JavaScript file, using AMD, which includes all dependencies of the specified input.

&gt; deno bundle https://deno.land/std/examples/colors.ts
Bundling &quot;colors.bundle.js&quot;
Emitting bundle to &quot;colors.bundle.js&quot;
9.2 kB emitted.

To run then bundle in Deno use

deno https://deno.land/std/bundle/run.ts colors.bundle.js

Bundles can also be loaded in the web browser with the assistance of RequireJS. Suppose we have a bundle called website.bundle.js, then the following HTML should be able to load it:

&lt;script src=&quot;https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js&quot;&gt;&lt;/script&gt;
&lt;script src=&quot;website.bundle.js&quot;&gt;&lt;/script&gt;
&lt;script&gt;
  requirejs([&quot;website&quot;], website =&gt; website.main());
&lt;/script&gt;

Here we assume there's an exported function main() from website.ts.

// website.ts
export main() {
  console.log(&quot;hello from the web browser&quot;);
}"><pre class="notranslate"><code class="notranslate">Bundling

deno bundle [URL] will output a single JavaScript file, using AMD, which includes all dependencies of the specified input.

&gt; deno bundle https://deno.land/std/examples/colors.ts
Bundling "colors.bundle.js"
Emitting bundle to "colors.bundle.js"
9.2 kB emitted.

To run then bundle in Deno use

deno https://deno.land/std/bundle/run.ts colors.bundle.js

Bundles can also be loaded in the web browser with the assistance of RequireJS. Suppose we have a bundle called website.bundle.js, then the following HTML should be able to load it:

&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js"&gt;&lt;/script&gt;
&lt;script src="website.bundle.js"&gt;&lt;/script&gt;
&lt;script&gt;
  requirejs(["website"], website =&gt; website.main());
&lt;/script&gt;

Here we assume there's an exported function main() from website.ts.

// website.ts
export main() {
  console.log("hello from the web browser");
}
</code></pre></div>