microsoft / microsoft/TypeScript
Inconsistent typechecking with require() in JS and TS
Nobody has claimed this yet.
- Dominant language
- Go
- Stars
- 111k
- Forks
- 14.3k
- Avg merge
- 2d 4h
- Merged PRs (30d)
- 132
Description
🔎 Search Terms
require import js ts module esm esmodule cjs commonjs
🕗 Version & Regression Information
- This happens in the nightly version of TS
⏯ Playground Link
Multiple files not supported in playground, see bug workbench
💻 Code
// @types: ["node"]
// @allowJs
// @checkJs
// @filename: module-cjs-js.js
const Value = "module-cjs-js";
module.exports = { Value };
// @filename: module-cjs-ts.ts
const Value = "module-cjs-ts";
module.exports = { Value };
// @filename: module-esm-js.js
const Value = "module-esm-js";
export { Value };
// @filename: module-esm-ts.ts
const Value = "module-esm-ts";
export { Value };
// @filename: main-js.js
const ConstRequireCjsJs = require("./module-cjs-js");
const ConstRequireEsmJs = require("./module-esm-js");
const ConstRequireCjsTs = require("./module-cjs-ts");
const ConstRequireEsmTs = require("./module-esm-ts");
console.log(ConstRequireCjsJs.Value); // (alias) const Value: "module-cjs-js"
// ^?
console.log(ConstRequireEsmJs.Value); // (alias) const Value: "module-esm-js"
// ^?
console.log(ConstRequireCjsTs.Value); // Error: Property 'Value' does not exist on type 'typeof import("./module-cjs-ts")'
// ^?
console.log(ConstRequireEsmTs.Value); // (alias) const Value: "module-esm-ts"
// ^?
import * as ImportFromCjsJs from "./module-cjs-js";
import * as ImportFromEsmJs from "./module-esm-js";
import * as ImportFromCjsTs from "./module-cjs-ts";
import * as ImportFromEsmTs from "./module-esm-ts";
console.log(ImportFromCjsJs.Value); // (alias) const Value: "module-cjs-js"
// ^?
console.log(ImportFromEsmJs.Value); // (alias) const Value: "module-esm-js"
// ^?
console.log(ImportFromCjsTs.Value); // Error: Property 'Value' does not exist on type 'typeof import("./module-cjs-ts")'
// ^?
console.log(ImportFromEsmTs.Value); // (alias) const Value: "module-esm-ts"
// ^?
// @filename: main-ts.ts
const ConstRequireCjsJs = require("./module-cjs-js");
const ConstRequireEsmJs = require("./module-esm-js");
const ConstRequireCjsTs = require("./module-cjs-ts");
const ConstRequireEsmTs = require("./module-esm-ts");
console.log(ConstRequireCjsJs.Value); // any
// ^?
console.log(ConstRequireEsmJs.Value); // any
// ^?
console.log(ConstRequireCjsTs.Value); // any
// ^?
console.log(ConstRequireEsmTs.Value); // any
// ^?
import * as ImportFromCjsJs from "./module-cjs-js";
import * as ImportFromEsmJs from "./module-esm-js";
import * as ImportFromCjsTs from "./module-cjs-ts";
import * as ImportFromEsmTs from "./module-esm-ts";
console.log(ImportFromCjsJs.Value); // (alias) const Value: "module-cjs-js"
// ^?
console.log(ImportFromEsmJs.Value); // (alias) const Value: "module-esm-js"
// ^?
console.log(ImportFromCjsTs.Value); // Error: Property 'Value' does not exist on type 'typeof import("./module-cjs-ts")'
// ^?
console.log(ImportFromEsmTs.Value); // (alias) const Value: "module-esm-ts"
// ^?
import ImportRequireCjsJs = require("./module-cjs-js");
import ImportRequireEsmJs = require("./module-esm-js");
import ImportRequireCjsTs = require("./module-cjs-ts");
import ImportRequireEsmTs = require("./module-esm-ts");
console.log(ImportRequireCjsJs.Value); // (alias) const Value: "module-cjs-js"
// ^?
console.log(ImportRequireEsmJs.Value); // (alias) const Value: "module-esm-js"
// ^?
console.log(ImportRequireCjsTs.Value); // Error: Property 'Value' does not exist on type 'typeof import("./module-cjs-ts")'
// ^?
console.log(ImportRequireEsmTs.Value); // (alias) const Value: "module-esm-ts"
// ^?
🙁 Actual behavior
Type resolution is inconsistent when using require() from .js and .ts files:
- CommonJS modules with .ts extension have no properties regardless of import type (no error if ESModule.ts or CommonJS.js)
- Using
require()in a .ts file is always unchecked (checked in a .js file or in .ts file withimport X =syntax)
| MainExt | Type | Ext | RequireOrImport | Issue |
|---|---|---|---|---|
| JS | CJS | JS | const X = require("Y") | |
| JS | ESM | JS | const X = require("Y") | |
| JS | CJS | TS | const X = require("Y") | Error |
| JS | ESM | TS | const X = require("Y") | |
| JS | CJS | JS | import * as X from "Y" | |
| JS | ESM | JS | import * as X from "Y" | |
| JS | CJS | TS | import * as X from "Y" | Error |
| JS | ESM | TS | import * as X from "Y" | |
| JS | CJS | JS | const X = require("Y") | |
| JS | ESM | JS | const X = require("Y") | |
| JS | CJS | TS | const X = require("Y") | Error |
| JS | ESM | TS | const X = require("Y") | |
| TS | CJS | JS | const X = require("Y") | Any |
| TS | ESM | JS | const X = require("Y") | Any |
| TS | CJS | TS | const X = require("Y") | Any |
| TS | ESM | TS | const X = require("Y") | Any |
| TS | CJS | JS | import * as X from "Y" | |
| TS | ESM | JS | import * as X from "Y" | |
| TS | CJS | TS | import * as X from "Y" | Error |
| TS | ESM | TS | import * as X from "Y" | |
| TS | CJS | JS | import X = require("Y") | |
| TS | ESM | JS | import X = require("Y") | |
| TS | CJS | TS | import X = require("Y") | Error |
| TS | ESM | TS | import X = require("Y") |
🙂 Expected behavior
I expected require() to be typechecked in .ts files because it's typechecked in .js files.
I expected imports of CommonJS .ts files to work because CommonJS .js files work and are typechecked.
Additional information about the issue
This problem happens when porting an existing Node.JS codebase that uses CommonJS require() modules to TypeScript. It's not possible to port the code without also forcing it into ES Modules because:
- CommonJS .ts files don't work
- require() from .ts files is not typechecked
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the supplied Workbench Repro and compare the require() and import forms across the listed .js and .ts CommonJS and ESM module files. Trace the typechecking and module-resolution entry points for these cases, then add regression coverage showing consistent property checking and CommonJS .ts imports across the matrix.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, node.js, typescript
- Domain
- compilers
- Issue type
- Bug
- Difficulty
- 5/5
- Estimated time
- Over a week
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 30/100