TS Internals

Preview — 3 of 10 questions

What does "moduleDetection": "force" do?

javascript

// tsconfig:
{ "compilerOptions": { "moduleDetection": "force" } }

AForces TypeScript to treat all files as CommonJS modules

BForces TypeScript to treat every .ts file as a module (not a script), even without import/export — prevents global scope pollution between files

CDetects module format automatically from package.json "type" field

DmoduleDetection: "force" is the default since TypeScript 5

When and why do you use declare global?

javascript

// In a module file (has import/export):
import { User } from './types';

declare global {
  interface Window {
    analytics: { track(event: string): void };
  }
  var __DEBUG__: boolean;
}

export {}; // ensure this is a module

Adeclare global allows a MODULE file to augment the global scope — adds types to Window, globalThis, etc. without affecting module-local scope

Bdeclare global is only valid in .d.ts files

Cdeclare global replaces window. access with type-safe alternatives

Ddeclare global makes all declarations in the block available to every file automatically

What problem does this solve in a React + Vite project?

javascript

// src/vite-env.d.ts
/// <reference types="vite/client" />

// OR manually:
declare module '*.png' {
  const src: string;
  export default src;
}

declare module '*.css' {
  const styles: { readonly [className: string]: string };
  export default styles;
}

declare module '*.json' {
  const data: unknown;
  export default data;
}

AThese ambient module declarations give TypeScript types for non-JS file imports — without them, import logo from './logo.png' is a TypeScript error

BThese declarations convert image/CSS files to JavaScript at build time

CTypeScript natively understands PNG, CSS, and JSON imports — these are redundant

DThese declarations are only needed for Node.js projects

Answer all 10 questions (7 more), see explanations for every answer, and track your score.