Referenced project ... must have setting "composite": true

[chriscurnow]

Current Behavior

My tsconfig files report an error:
Referenced project ... must have setting "composite": true.

Expected Behavior

Automatically generated tsconfig files should be error free.

GitHub Repo

No response

Steps to Reproduce

1. create a new workspace
2. create some projects
3. Everything seems ok at first
4. At some point I will be working on a project and suddenly this error will come up in the tsconfig file. I won't be working in the tsfonfig file. The error just appears.

Nx Report

nx (global)        : 19.4.3
nx                 : 19.5.3
@nx/js             : 19.5.3
@nx/jest           : 19.5.3
@nx/linter         : 19.5.3
@nx/eslint         : 19.5.3
@nx/workspace      : 19.5.3
@nx/angular        : 19.5.3
@nx/devkit         : 19.4.4
@nx/eslint-plugin  : 19.5.3
@nx/playwright     : 19.4.4
@nrwl/tao          : 19.5.3
@nx/web            : 19.5.3
@nx/webpack        : 19.5.3
typescript         : 5.5.4
---------------------------------------
Registered Plugins:
@nx/playwright/plugin
@nx/eslint/plugin
---------------------------------------
Community plugins:
@ngrx/component-store : 18.0.2
@ngrx/effects         : 18.0.2
@ngrx/entity          : 18.0.2
@ngrx/operators       : 18.0.2
@ngrx/router-store    : 18.0.2
@ngrx/schematics      : 18.0.2
@ngrx/signals         : 18.0.2
@ngrx/store           : 18.0.2
---------------------------------------
The following packages should match the installed version of nx
  - @nx/[email protected]
  - @nrwl/[email protected]
  - @nx/[email protected]

To fix this, run `nx migrate [email protected]`

Failure Logs

No response

Package Manager Version

No response

Operating System

• macOS
• Linux
• Windows
• Other (Please specify)

Additional Information

I realise this report is essentially the same as #20957 but I don't believe it should have been closed.
The error persists in automatically generated tsconfig files.
This is a bug.
The comment referenced a link which no longer exists: #20957 (comment).
@jaysoo commented here #20957 (comment), that we were free to add composite:true, but

1. We shouldn't have to
2. This produces errors in many other places.
   This should be handled by the generators.

[arndwestermann]

I have the same error, this only popped up recently like a month or two ago or so.
You can do a Restart Extension Host in VSCode, but if I make any changes to a lib or app, for example add a new file, this error comes back again. I hadn't any trouble with that a while ago, but right now this is really annoying.

[chriscurnow]

@arndwestermann, this has to do with the introduction of 'composite' in Typescript. It's not something I tend to spend a lot of time thinking about. I just want it to work.

I can't find where I found this but this arrangement seems to work.

In tsconfig.base.json, include

"compilerOptions:{ "declaration": true, "composite": true, "emitDeclarationOnly": true, }

And then in tsconfig.app.json or tsconfig.lib.json include

`
"compilerOptions": {

"emitDecoratorMetadata": true,
"composite": true,
"declaration": true,
"declarationMap": true,

},
}`

The problem I have is I think the Nx generators should do this for us.

[arndwestermann]

@chriscurnow I think it is just sufficient enough to add this

"compilerOptions": {
    "declaration": true,
    "composite": true,
    "emitDeclarationOnly": true,
    ...
},

to the tsconfig.base.json, since any tsconfig.app.json/tsconfig.lib.json extend the local tsconfig.json which extends the tsconfig.base.json, at least this got already rid of the errors. Thanks for that.
I agree, this IMOH should be done by the nx generator or by a migration.

EDIT:

@chriscurnow hm your solution unfortunately doesn't seem to work as I initially thought, even with putting also these flags into the app/lib configs, I'm getting a ton of these errors when I try to prod build the libs/apps

libs/shared/src/lib/util/index.ts:14:15 - error TS6307: File '[REDACTED]/libs/shared/src/lib/util/rxjs.util.ts' is not listed within the file list of project '[REDACTED]/libs/shared/tsconfig.lib.prod.json'. Projects must list all files or use an 'include' pattern.

export * from './rxjs.util';

If I understand it correctly It wants me to use the include: [] property to specify the files. but since tsconfig.lib.prod.json extends tsconfig.lib.json which has this "include": ["src/**/*.ts"] it should work or am I missing something?

[cmrabet]

I also have this problem and is very annoying. All libs are red flagged.

[juanchavezlive]

Same error here since several weeks

[HenrikTusz]

Same here

[Banegasn]

same problem here any news?

[rs-r2d2]

+1

[dgoerdes]

I think not using the composite: true option is intended by NX.
As setting it to true will make tsc to compile all of the referenced packages at once and depends on their code. However in a monorepo setup, as it goes for NX, we want to be able to compile packages individually and not treat everything as one connected thing.

It is annoying the IDE complains about it but it does not affect or causes any other issues than just the IDE complaining.

Please add information or correct me if this is wrong.

I would also love if someone has a solution to keep VSCode silent on this.

[grigor-minasyan]

what helped in my case was downgrading typescript to 5.5.3, the issue only appeared in my case with 5.5.4

[alo]

maybe @juristr can clarify this... 🤷

Thanks in advance

[Khanon]

More than two months of this issue and no solution?

[TarikKalyoncu]

helpp

[demirtasdurmus]

Any progress or ideas on this one?

[pwglownia]

I think not using the composite: true option is intended by NX. As setting it to true will make tsc to compile all of the referenced packages at once and depends on their code. However in a monorepo setup, as it goes for NX, we want to be able to compile packages individually and not treat everything as one connected thing.

It is annoying the IDE complains about it but it does not affect or causes any other issues than just the IDE complaining.

Please add information or correct me if this is wrong.

I would also love if someone has a solution to keep VSCode silent on this.

I would simply ts-ignore it, until we find the better solution :)

  "references": [
    // @ts-ignore -> https://github.com/nrwl/nx/issues/27292
    {
      "path": "./tsconfig.app.json"
    },
    {
      "path": "./tsconfig.spec.json"
    }
  ],

[KentoMoriwaki]

I was also troubled by the same error, but it seems to have stopped occurring after I disabled the VSCode Plugin NX Console. This plugin might be the cause of the issue.

[twestendorff]

We have the same problem. The problem is no longer shown in VSCode when the NX Console version v18.24.1 is used.

Downgrading may be a workaround, but I agree with the issue creator, the problem shouldn't be there. In the IDE, especially for new project participants, it looks like they did something wrong/something is not working.

[semanticist21]

My version is v20.0.5 but the error still occurs.

[salez]

this error keeps occuring from time to time, editing the file and saving it again makes the error goes away, but it's pretty annoying

[nakash2050]

I was also troubled by the same error, but it seems to have stopped occurring after I disabled the VSCode Plugin NX Console. This plugin might be the cause of the issue.

This worked for me. I miss using Nx console options but could not stand seeing the annoying error. Whole VS Code was lit up.

[jedihacks]

Really annoying - happens for us too

[laszlo-ratesic]

+1

[semanticist21]

https://nx.dev/nx-api/js/documents/typescript-project-references

According to the Doc, they say 'composite' value should be true. I changed the value to true.

[morgan-wild]

https://nx.dev/nx-api/js/documents/typescript-project-references

According to the Doc, they say 'composite' value should be true. I changed the value to true.

And now, you cannot compile.

[denys5dev]

I've been facing the same error in my Nx monorepo with Nx Console and VS Code for the past two years. Interestingly, my colleagues using WebStorm don't encounter this issue. We don't use the composite flag in our configuration. I'm not entirely sure where the issue lies, or on which side it has to be fixed. it’s more of an annoyance, as it doesn’t affect compilation or functionality.

[TinekeinTOWN]

@morgan-wild what solved the compiling issue for me (in my React / Vite app) was:

1. adding "composite": true, to tsconfig.json
2. removing "noEmit": true, from tsconfig.json
3. adding "composite": true, to the tsconfig.app.json + tsconfig.node.json reference files
4. adding '"allowImportingTsExtensions": true,' to the tsconfig.app.json + tsconfig.node.json reference files
5. changing (or adding) noEmit to emitDeclarationOnly in the tsconfig.app.json + tsconfig.node.json reference files

[namnguyen191]

This works for me for building Angular libs + using vitest + [email protected]:

• In packages/my-lib/tsconfig.json:

// Note: tsconfig-angular.base.json is just an normal tsconfig file for Angular that I share across multiple libs and apps
{
  "extends": "../../tsconfig-angular.base.json", 
  "references": [
    {
      "path": "./tsconfig.lib.json"
    },
    {
      "path": "./tsconfig.spec.json"
    }
  ]
}

• In packages/my-lib/tsconfig.lib.json:

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "declaration": true, // THIS IS IMPORTANT
    "composite": true, // THIS IS IMPORTANT
    "declarationMap": true,
    "outDir": "../../../dist/out-tsc",
    "inlineSources": true,
    "types": []
  },
  "exclude": [
    "src/**/*.spec.ts",
    "src/test-setup.ts",
    "jest.config.ts",
    "src/**/*.test.ts",
    "vite.config.ts",
    "vite.config.mts",
    "vitest.config.ts",
    "vitest.config.mts",
    "src/**/*.test.tsx",
    "src/**/*.spec.tsx",
    "src/**/*.test.js",
    "src/**/*.spec.js",
    "src/**/*.test.jsx",
    "src/**/*.spec.jsx",
    "src/test-setup.ts"
  ],
  "include": ["src/**/*.ts"]
}

• In packages/my-lib/tsconfig.spec.json:

{
  "extends": "./tsconfig.json",
  "compilerOptions": {
    "declaration": true, // THIS IS IMPORTANT
    "composite": true, // THIS IS IMPORTANT
    "outDir": "../../dist/out-tsc",
    "types": ["vitest/globals", "vitest/importMeta", "vite/client", "node", "vitest"]
  },
  "include": [
    "vite.config.ts",
    "vite.config.mts",
    "vitest.config.ts",
    "vitest.config.mts",
    "src/**/*.test.ts",
    "src/**/*.spec.ts",
    "src/**/*.test.tsx",
    "src/**/*.spec.tsx",
    "src/**/*.test.js",
    "src/**/*.spec.js",
    "src/**/*.test.jsx",
    "src/**/*.spec.jsx",
    "src/**/*.d.ts"
  ],
  "files": ["src/test-setup.ts"],
  "references": [
    {
      "path": "./tsconfig.lib.json"
    }
  ]
}

• In packages/my-lib/tsconfig.lib.prod.json:

{
  "extends": "./tsconfig.lib.json",
  "compilerOptions": {
    "declaration": false, // THIS IS IMPORTANT
    "composite": false // THIS IS IMPORTANT
  },
  "angularCompilerOptions": {
    "compilationMode": "partial"
  }
}

The idea is pretty simple. We need tsconfig.json to reference to tsconfig.lib.json and tsconfig.spec.json for VSCode TS syntax highlighting to work properly. But, we do not want composite: true and declaration: true when the lib is being build for production (due to Angular compiler does not support TS incremental build yet). So, we use a separate tsconfig.lib.prod.json that will be ignored by VSCode (since we did not reference it in tsconfig.json) but will be used in the build process (it's being used somewhere in project.json, under targets.build.configurations.production.tsConfig)

[ThePlenkov]

any progress on this problem from nx side?

[ardokirsipuu]

https://nx.dev/nx-api/js/documents/typescript-project-references

According to the Doc, they say 'composite' value should be true. I changed the value to true.

That doc is only for the Nx workspaces that utilize the new TypeScript Project References. However, at this point it's not fully supported yet. From the same blog post:

Note that we've enabled Project References and Workspaces for the TS preset (i.e. --preset=ts), and we're working on extending this support for all other presets soon (Angular, React, Vue, Node).

Furthermore, I also think this is intended to be false by Nx (for non-TypeScript-Project-References workspaces) for reasons stated in a previous comment.

To sum it up, we just need to bare with the IDE errors until somebody manages to address it somehow or until Nx starts fully supporting TypeScript Project References and we manage to migrate our existing workspaces to it.

[anshul-financeops]

I usually keep the NX Console plugin disabled and only enable it when I need to generate apps or libraries. This isn't a perfect solution but helps eliminate the red squiggly lines, ensuring errors only appear for genuine compilation issues. Additionally, I’ve noticed that the cursor responds faster with the plugin disabled.

[ardokirsipuu]

The error doesn't come from the plugin. I don't have the plugin enabled, yet I still have these errors.