How can I use typed variables as types with same name in Typescript?

Question

When using THREE.js along with Typescript, you can use the same names for types and code. For example:

import * as THREE from '/build/three.module.js'

// Following line uses THREE.Scene as type and code
const scene: THREE.Scene = new THREE.Scene()

Demo

Im trying to replicate the same behaviour in my own code, but In not sure how to do it. This is what Ive tried:

// typedModule.ts

export const typedConstant1: string = "string";

// Doesnt work
// declare global {
//     namespace typedModule {
//       export type typedConstant1 = typeof typedConstant1
//     }
//   }

// index.ts

import * as typedModule from "./typedModule";

const someVariable: typedModule.typedConstant1 = typedModule.typedConstant1; // ERROR: Namespace '"/sandbox/src/typedModule"' has no exported member 'typedConstant1'.ts(2694)

Demo

jcalz · Accepted Answer · 2021-02-08 16:49:12Z

3

You should be able to export types the same way you export values:

export const typedConstant1: string = "string";
export type typedConstant1 = typeof typedConstant1;

and then importing should work:

import * as typedModule from "./typedModule";

const someVariable: typedModule.typedConstant1 = typedModule.typedConstant1;
// const someVariable: string

Modified codesandbox demo

Similar code in TS Playground

answered Feb 8, 2021 at 16:49

jcalz

339k29 gold badges452 silver badges449 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How can I use typed variables as types with same name in Typescript?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related