Writing custom endpoints in Typescript

[gdpdils]

Hi. The documentation says "If you are using TypeScript, the JS-SDK requires TypeScript 3.8 or newer. TypeScript will also improve the development experience".

I do want to use Typescript to develop custom endpoint in /extensions/endpoints. How to setup a Directus project to use Typescript?

Thanks

[rijkvanzanten]

There's no special sauce to make any language or bundler work with Directus. As long as the output file is a regular javascript file in the correct location, you can use any build chain 👍🏻

[gdpdils]

My dev chain is to run directus start and work on the app from that. No special sauce, to me, would be being able to put a .ts file under /extensions/endpoints/test instead of .js file and have Directus infer that it is a Typescript project, compile it, serve it, and watch it for changes.

If this is not the case (and from my tests it isn't), maybe there is a need for a little help in the documentation (or here) to help a person setup an environment that uses Typescript.

[rijkvanzanten]

TypeScript isn't a valid language when it comes to NodeJS, so something has to convert that back into regular JavaScript before it can be used. The API doesn't do any transpilation or building on your behalf, as it would be impossible to have a single configuration that would work for every persons personal flavors and configurations 👍🏻

We've created an extension helper package that will scaffold a typescript config with sensible defaults, see Nicola's answer below

[gdpdils]

Ok, thank you, I'll try directus-extension as suggested by @nickrum

[nickrum]

You can use npm init directus-extension to scaffold Typescript extensions.

[gdpdils]

Thanks for you suggestion, nickrum. A quick question. What's the best workflow to dev / test a Typescript-based custom extension? Using Javascript, directus start takes care of discovering the extensions, running the server, watching the files for changes and reload them. How do one nicely integrates the extra compilation step required by Typescript in this workflow? Thanks

[nickrum]

Unfortunately, this is a little bit tricky right now. The build command of the extensions-sdk has a --watch flag. You have to instruct the extensions-sdk to build extensions into the extensions/ folder. In addition to that, you have to use something like nodemon to reload the Directus API server once the extension source changes.

We are working on a way to make this a lot easier.

[gdpdils]

Thank you so much, looking forward for updates in this field. Thank you for you amazing work!

[jrvidotti]

In directus project package.json:
"dev": "nodemon --exec 'directus start' --watch extensions"

In extensions package.json something like that building when something has changes. I have made a symlink to extensions output folder to project extensions and is working fine.

[jclaveau]

The env var EXTENSIONS_AUTO_RELOAD="true" seems to be the up to date way to do it https://docs.directus.io/self-hosted/config-options.html#extensions .

But it's logging message INFO: Reloading extensions appears quite randomly compared to nodemon log...