Typescript ~ Project References #1036

Feature Use Case

Project References
https://www.typescriptlang.org/docs/handbook/project-references.html

The current version of the TypeScript plugin has no awareness of the multiple-project configuration that can be setup with a tsconfig file. This will result in errors such as Plugin typescript: @rollup/plugin-typescript TS6305: Output file '....d.ts' has not been built from source file '....ts'

Feature Proposal

Provide a toggle flag inside the typescript plugin, or detect when references is set. If set, load reference project files first before building out the main project.

ts-loader in https://github.com/TypeStrong/ts-loader/blob/47e374bab698676c62d09d515580f4c847ea157a/src/instances.ts already has a good example of this on line 489 -> buildSolutionReferences.

The command from the API is ts.createSolutionBuilder which requires a SolutionBuilderHost object as detailed here microsoft/TypeScript#31432 . Then once created, the builder.build(); function is called to generate the necessary files.

I have created a very rough prototype of the function I am using for my own local project. Please take a look below...

Changed the watchProgram.ts from line 146 with the following modification

function createWatchHost(
  ts: typeof import('typescript'),
  context: PluginContext,
    formatHost,
    parsedOptions,
    writeFile,
    status,
    resolveModule,
    transformers
  }: CreateProgramOptions
): WatchCompilerHostOfFilesAndCompilerOptions<BuilderProgram> {
  const createProgram = ts.createEmitAndSemanticDiagnosticsBuilderProgram;
  const diagnostics = buildDiagnosticReporter( ts, context, formatHost );
  //TODO this may also use createSolutionBuilderWithWatchHost to allow file watching.
  const hostBuilder = ts.createSolutionBuilderHost(
    ts.sys,
    createProgram,
    diagnostics
    //TODO implement reportSolutionBuilderStatus, reportWatchStatus
  // Create a instance of the builder to be used to generate file changes.
  // TODO this may also use createSolutionBuilderWithWatch to watch files.
  const builder = ts.createSolutionBuilder( hostBuilder, parsedOptions.projectReferences!.map( ref => ref.path ), {verbose: true} )
  // ts.createSolutionBuilderWithWatch( solutionBuilderHost, )
  builder.build();
  //TODO check timestamps if applicable.
  const baseHost = ts.createWatchCompilerHost(
    parsedOptions.fileNames,
    parsedOptions.options,
    ts.sys,
    createProgram,
    diagnostics,
    status,
    parsedOptions.projectReferences
Putting it in createWatchHost is a bit weird, but it had all the variables ready so made it a bit easier to integrate. It is very rough, but it does work and build the modules as expected...