Skip to content

Multiple entries to output multiple build files #175

@fnky

Description

@fnky

Current Behavior

When building source with multiple entries, using --entry src/**.ts the build only uses the source of the first file it finds as the main entry point for ESM and CJS output.

Desired Behavior

It would be nice to be able to specify multiple destinations for different source files from a single codebase.

Suggested Solution

A solution could be to change the behavior of --entry flag, so that instead of outputting only definition files from multiple sources, it should output entry points for each specified entry file.

For example, with a folder structure like this:

src/
  code.ts
  ui.ts

Running tsdx build --entry src/**.ts or --entry src/code.ts src/ui.ts will yield the following output files:

dist/
  code.js
  code.cjs.production.js
  code.cjs.development.js
  code.esm.js
  ui.js
  ui.cjs.production.js
  ui.cjs.development.js
  ui.esm.js

Where code.js and ui.js are similar to index.js for single entry projects.

Who does this impact? Who is this for?

This is useful for building applications, plugins or other types of projects, where multiple entries are required, without having to create a monolithic repo architecture with a custom build process to combine build files.

An example is the recently released Figma Plugin API, which specifies a main file for the underlying plugin code, and a ui file for browser UI part.

See an example project using React and Webpack to create a Figma UI plugin

Describe alternatives you've considered

  • Creating a monorepo and using a custom script to merge the builds into a single folder.
  • Move to a custom setup with webpack that allows for this type of configuration.

Additional context

I was looking for ways to specify multiple entries with --entry as outlined in #28 but it seems to only output source files for the first file it finds and the rest just outputs as definition files, not actual source files. This is a bit confusing and may be a bug as it shares the same property name as webpack (entry), but works differently.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions