Document how to use tsconfig-related APIs in the wiki

[thepassle]

🔎 Search Terms

"createProgram" "compiler" "compiler api" "js files createProgram" "js compiler api" "js files compiler" "programmatic compiler js"

🕗 Version & Regression Information

Give my project:

my-project/
├─ src/
│  ├─ index.js
├─ tsconfig.json

The following code:

import ts from 'typescript';

let tsConfigFile = ts.findConfigFile(
  process.cwd(),
  ts.sys.fileExists,
  "tsconfig.json"
);
const { config } = ts.readConfigFile(tsConfigFile, ts.sys.readFile);

const program = ts.createProgram(['src/index.js'], config);

program.getSourceFiles().forEach((sf) => {
  console.log(1, sf.fileName);
});

Where tsconfig.json looks like:

{
  "compilerOptions": {
    "strict": true,
    "outDir": "./dist-types",
    "target": "ESNext",
    "allowSyntheticDefaultImports": true,
    "moduleResolution": "NodeNext",
    "module": "NodeNext",
    "lib": ["ESNext", "DOM"],
    "declaration": true,
    "emitDeclarationOnly": true,
    "allowJs": true,
    "checkJs": true,
    "skipLibCheck": true,
    "verbatimModuleSyntax": true
  },
  "include": [
    "src/index.js"
  ],
  "exclude": ["node_modules"],
}

Outputs:

1 /Users/au87xu/cem-typescript-issue/node_modules/typescript/lib/lib.d.ts
1 /Users/au87xu/cem-typescript-issue/node_modules/typescript/lib/lib.es5.d.ts
1 /Users/au87xu/cem-typescript-issue/node_modules/typescript/lib/lib.dom.d.ts
1 /Users/au87xu/cem-typescript-issue/node_modules/typescript/lib/lib.webworker.importscripts.d.ts
1 /Users/au87xu/cem-typescript-issue/node_modules/typescript/lib/lib.scripthost.d.ts
1 /Users/au87xu/cem-typescript-issue/node_modules/typescript/lib/lib.decorators.d.ts
1 /Users/au87xu/cem-typescript-issue/node_modules/typescript/lib/lib.decorators.legacy.d.ts

but src/index.js is missing from the source files. I feel like this did work in the past, or at least should work on regular js files as well.

⏯ Playground Link

n/a

💻 Code

// Your code here

🙁 Actual behavior

ts.createProgram does not include src/index.js

🙂 Expected behavior

ts.createProgram does include src/index.js

Additional information about the issue

No response

[thepassle]

Fixed by:

-const program = ts.createProgram(['src/index.js'], config);
+const program = ts.createProgram(['src/index.js'], config.compilerOptions);

[RyanCavanaugh]

The proposed fix is also wrong; you need to parse the config file once it's loaded:

const { config } = ts.readConfigFile(tsConfigFile, ts.sys.readFile);
const opts = ts.convertCompilerOptionsFromJson(config, ".");
const program = ts.createProgram(['src/index.js'], opts);

[thepassle]

Thanks for that update! Is this documented anywhere? I found it hard to find information about this, and wasnt sure where to search

[RyanCavanaugh]

We really need to add this to https://github.com/microsoft/TypeScript/wiki/Using-the-Compiler-API - the anys that come out of readConfigFile get people tripped up all the time.

[KonnorRogers]

The proposed fix is also wrong; you need to parse the config file once it's loaded:

const { config } = ts.readConfigFile(tsConfigFile, ts.sys.readFile);
const opts = ts.convertCompilerOptionsFromJson(config, ".");
const program = ts.createProgram(['src/index.js'], opts);

I actually tried this and it didn't work for me. I had to do this:

const { config } = ts.readConfigFile(configFile, ts.sys.readFile);
- const opts = ts.convertCompilerOptionsFromJson(config, ".");
+ const {options, errors} = ts.convertCompilerOptionsFromJson(config.compilerOptions, ".");
- const opts = ts.convertCompilerOptionsFromJson(config, ".");
+ const program = ts.createProgram(['src/index.js'], options);

[thepassle]

Yeah, the using-the-compiler-api page could definitely use some love :)

[KonnorRogers]

Well..turns out that was actually dropping my checkJs and allowJs and doing some funky transforms of strings into numbers. This is what finally worked for me.

const configFileName = ts.findConfigFile(
  "./",
  ts.sys.fileExists,
  "tsconfig.json"
);
const configFile = ts.readConfigFile(configFileName, ts.sys.readFile);
const {options} = ts.parseJsonConfigFileContent(
  configFile.config,
  ts.sys,
  "./"
);

let program = ts.createProgram(fileNames, options);