Importing .tsx with esbuild

[spencewood]

- Do you want to request a feature or report a bug?

Feature request

- What is the current behavior?

Using the new "esbuild" node bundler, any attempts at importing .tsx files result in a build error about the imported file not being found.

- If the current behavior is a bug, please provide the steps to reproduce.

I've created a repo for this case here: https://github.com/spencewood/netlify-tsx-test

Trying to run in development mode using npm run dev gives the following:

◈ Building functions from directory functions
 > functions/testtsx/testtsx.ts:1:24: error: Could not resolve "./hello"
    1 │ import { getBody } from "./hello";
      ╵                         ~~~~~~~~~

And a similar build error building:

11:53:07 AM: ────────────────────────────────────────────────────────────────
11:53:07 AM:   1. Functions bundling                                         
11:53:07 AM: ────────────────────────────────────────────────────────────────
11:53:07 AM: ​
11:53:07 AM: Packaging Functions from functions directory:
11:53:07 AM:  - testjsx/testjsx.js
11:53:07 AM:  - testtsx/testtsx.ts
11:53:07 AM: ​
11:53:07 AM:  > functions/testtsx/testtsx.ts:1:24: error: Could not resolve "./hello"
11:53:07 AM:     1 │ import { getBody } from "./hello";
11:53:07 AM:       ╵                         ~~~~~~~~~

For this example, I simply copied the "testjsx" version and renamed the files to .ts and .tsx. No other changes were made. The "testjsx" function is successfully built and works if the typescript function is removed.

- What is the expected behavior?

Esbuild does appear to have typescript support for .tsx, so maybe it is just a matter of handling this file type import. Again, importing .jsx files appears to work correctly with esbuild and returns the expected:

<div>hello jsx</div>

- Please mention your node.js, and operating system version.

• MacOS 11.2 (Big Sur)
• Node 14

[erezrokah]

@eduardoboucas do you think this is a good candidate for good first issue? Maybe we can get a contribution for this. Is this the right place to start? https://github.com/netlify/zip-it-and-ship-it/blob/b8eb5f8da62d48468c4aff35f2ed65b175bb14c7/src/runtimes/node/bundler.js#L19

[eduardoboucas]

@eduardoboucas do you think this is a good candidate for good first issue? Maybe we can get a contribution for this. Is this the right place to start? https://github.com/netlify/zip-it-and-ship-it/blob/b8eb5f8da62d48468c4aff35f2ed65b175bb14c7/src/runtimes/node/bundler.js#L19

💯 Yes and yes.

[erezrokah]

If anyone would like to pick this up, see our contributing guide

[outerlook]

It is a good idea to be able to customize somehow which extensions can be added? Like less used extensions .astro, .svelte. Or should it be compiled before this step?