Configuring TypeScript 16 exercises

Enforcing Import Syntax

Let's take a look at a tricky situation we can encounter with .cts files.

Consider this fake ESModule that will be outputted when "module": "NodeNext" is set:

// Fake ESM!
// @ts-expect-error
export const example = () => {
return "hello!";

Remember, if we're workin

Loading exercise


00:00 If we think about it, we're in a weird situation when we have a .cts file that we're using kind of fake ES modules inside. The reason they're fake is that what will get outputted here if we're using module node next is actually cjs. So we've got this fake ESM system kind

00:17 of masquerading, a fake cjs system masquerading as ESM. That can be really, really painful and actually cause you some issues down the road. And so it would be really nice if the tsconfig.json file enforced you to use the correct syntax. The correct syntax here is

00:34 actually instead of using export is to say export equals example like this. This will actually output the correct stuff. So it's a little bit weird that we've got this. So your job here is to find a tsconfig option and stick it inside the tsconfig.json that

00:51 will give you an error here that will force you to use cjs stuff inside cts files. And I will give you a little cheeky link below just so you're not looking too long. But if you can look through the TypeScript docs and figure it out, good luck.