Triple-slash directives in Typescript - Mini Project: Build & Apply

Using Triple-slash Directives in TypeScript

📖 Scenario: You are working on a TypeScript project that uses multiple files. You want to tell the compiler about dependencies between files using triple-slash directives.

🎯 Goal: Learn how to add triple-slash directives to reference other TypeScript files so the compiler knows about them.

📋 What You'll Learn

Create a TypeScript file with a triple-slash directive referencing another file

Add a variable to hold the path of the referenced file

Use the triple-slash directive syntax correctly

Print the referenced path to verify

💡 Why This Matters

🌍 Real World

Triple-slash directives help TypeScript projects manage dependencies between files without using module imports.

💼 Career

Understanding triple-slash directives is useful for maintaining legacy TypeScript codebases and for projects that do not use module loaders.

1

Create a TypeScript file with a triple-slash directive

Create a TypeScript file and add a triple-slash directive referencing the file utils.ts using /// <reference path="utils.ts" /> at the top.

Typescript

/// 
// Your code here

Need a hint?

Triple-slash directives start with /// and must be at the top of the file.

2

Add a variable for the referenced file path

Add a variable called referencePath and set it to the string "utils.ts".

Typescript

/// 
const referencePath = "utils.ts";
// Your code here

Need a hint?

Use const to create a variable that holds the path string.

3

Use the triple-slash directive syntax correctly

Ensure the triple-slash directive is exactly /// <reference path="utils.ts" /> and placed at the very top of the file before any other code.

Typescript

/// 
const referencePath = "utils.ts";
// Your code here

Need a hint?

Triple-slash directives must be the very first line in the file.

4

Print the referenced path

Write console.log(referencePath) to print the value of referencePath.

Typescript

/// 
const referencePath = "utils.ts";
// Your code here

Need a hint?

Use console.log() to display the variable's value.