bundle result should not be transformed to requirejs module.

[timreichen]

bundle result should not be transformed to requirejs module.

[timreichen]

Agreed. Thats a bug, it should do esm by default. I will fix it in the next update.
I will not switch to babel by default, since ts transpile can do esm also.

[aaronwlee]

This is my suggestion

As long as deno supports the ts compiler API which is Deno.transpileOnly, I think this is more make sense and we can get the higher benefits when you're using the babel such as react preset or other preset which means it can support vue.js react.js anguler.js.

And this kind of plugins are really helpful to reduce the bundle size. https://www.npmjs.com/package/babel-plugin-transform-imports

const isTS = (path: string) => /\.(tsx?|ts?)$/.test(path);
const isReact = (path: string) => /\.(tsx?|jsx?)$/.test(path);

function injectDependenciesPlugin(
  changeMap: ChangeMap,
  outputPathMap: { [resolvedPath: string]: string },
  compilerOptions: CompilerOptions,
) {
  return async (input: string, output: string | undefined, depsDir: string) => {
    let data: string = await fetchTextFile(input);
    const moduleDeps = changeMap[input];

    if (isTS(input)) {
      // transpile
      data = (await Deno.transpileOnly({
        [input]: data
      }, compilerOptions))[input].source
    }

    const replacer = ({
      enter(path: any, state: any) {
        if (path.node.source) {
          const moduleNodePath = path.node.source.value;

          // get relative path to dist dir
          const resolvedPath = moduleDeps.dependencies[moduleNodePath];

          // either name of transpiled file or new uuid name
          let newPath;
          const outputPath = outputPathMap[resolvedPath];
          if (isURL(outputPath)) {
            // keep url import instead of caching it
            newPath = outputPath;
          } else {
            newPath = outputPathMap[resolvedPath] = outputPath ||
              `${v4.generate()}.js`;
            // if is named file, its dir is dist dir, else is dist/deps
            newPath = join(output ? depsDir : ".", newPath);
            newPath = `./${newPath}`;
          }
          //append relative import string
          path.node.source.value = newPath;
        }
      }
    })

    try {
      const outputText = await (babelCore as { transform: Function }).transform(data, {
        presets: isReact(input) ? [babelPresetReact] : [],
        plugins: [
          () => ({
            visitor: {
              ImportDeclaration: replacer,
              ExportAllDeclaration: replacer,
              ExportNamedDeclaration: replacer
            }
          })
        ],
        comments: false
      }).code;
  
      return outputText;
    } catch(err) {
      throw {
        error: err,
        data,
        input
      }
    }
  };
}

it's totally up to you :)

[aaronwlee]

Also, I've been applied this bundler to the Attain.
This bundler generates all the files as a local file, and this meaning is the server should handle all the modules as synchronously not asynchronously.
So, I'd like to suggest in the final stage of bundle how about to use this Deno.bundle API?

[timreichen]

Thanks for your suggestion.

Babel default transpiler

Deno switched to swc, so in the future this bundler should use swc as a deno plugin instead of the ts compiler. Until then, I think we should stick with ts for transpilation. But you should be able to use babel to transform/minify code with the Bundler API.

Deno.transpileOnly

I am currently working on an implementation for system modules, that creates a standalone module like Deno.transpileOnly but also creates dynamically imported paths as separate modules that can be imported when needed.