Compodoc: [FEATURE] Angular 9+ support?

Created on 23 Jul 2020  路  15Comments  路  Source: compodoc/compodoc

Will compodoc support versions after Angular 8?

Compodoc doesn't work at all with Angular 9+.

Motivation for or Use Case

Most of the apps I've used are now on 9 and 10 was released in June.

Related issues

The only thing it generates is the README. tsconfig.app.json is no longer is /src, etc.

Enhancement wontfix

Most helpful comment

I cannot also run compodoc out of the box.

As I've read from compodoc documentation:
compodoc reads src/tsconfig.app.json and starts to scan files from the directory where tsconfig.app.json is stored

But as you have noticed tsconfig.app.json is no more in src in angular 9, so the command compodoc -p tsconfig.app.json will start to scan at the root directory, so scans the *.md files and stops after as no typescript file is pointing to some files in src/ (so the scan stops)

As a result, I've used the following trick by creating a dummy src/tsconfig.compodoc.json that just contains:
{ "extends": "../tsconfig.app.json" }

And then I run compodoc -p src/tsconfig.compodoc.json and the scan is working again for my entire project

It's clearly a workaround but it works for me...

I've tried to tell compodoc to scan src and use a specific tsconfig, with: compodoc src/ -p tsconfig.app.json but it doesn't work, I don't know why, according to compodoc documentation it should work (a bug from compodoc in parsing argument maybe ?)

All 15 comments

We just started to use Compodoc in our Angular 9 projects and it works. I haven't used it with version 8 so I don't know if something is missing.
To your problem with the move of tsconfig.app.json in Angular 9, you can specify the location of it with arguments like npx compodoc -p tsconfig.app.json putting the path to the specific tsconfig after the -p argument. For more infos take a look into https://compodoc.app/guides/options.html .

We are useing version 1.1.11.

Hey @hamburghammer,

We're also using 1.1.11 and tried using the -p argument as well and that also doesn't work. It only generates a README.md.

@tsteuwer - for what it's worth, I was able to get it running on an Angular 10 application. In my initial execution, it also only built a readme file for me. After some troubleshooting, I realized that my tsconfig.app.json file wasn't pointing compodoc at the right files. I'd recommend troubleshooting from this direction to see if compodoc is scanning your application directory correctly.

@RoboZoom I've tried several things in the tsconfig.app.json but I'm not sure what you mean by its not pointing at the right files? Could you elaborate or post your configuration?

@tsteuwer - When you run the command for compodoc, when I used the default tsconfig with my application, it only looked at 1 or two files and the only file produced in the documentation was the 'readme' file.

Try commenting out the entire tsconfig.json file and seeing if that makes a difference. That should push Compodoc into a default mode which will analyze everything in your source folder.

@RoboZoom after going through the issues list, looks like someone figured it out. It can't use tsconfig.app.js, it had to use tsconfig.js. changing it to use that config resolved the issue, but now my lazy routes don't seem to show up. Oh well at least the majority of it works now. Though I feel like we should keep this item open since it's not working out of the box and there are lots of issues with it not working properly (e.g. lazy routes, etc)

The .history directory created by Visual Studio Code was breaking compodoc in my case.

npx compodoc -p tsconfig.base.json -s

This command works for me in angular 10.

I cannot also run compodoc out of the box.

As I've read from compodoc documentation:
compodoc reads src/tsconfig.app.json and starts to scan files from the directory where tsconfig.app.json is stored

But as you have noticed tsconfig.app.json is no more in src in angular 9, so the command compodoc -p tsconfig.app.json will start to scan at the root directory, so scans the *.md files and stops after as no typescript file is pointing to some files in src/ (so the scan stops)

As a result, I've used the following trick by creating a dummy src/tsconfig.compodoc.json that just contains:
{ "extends": "../tsconfig.app.json" }

And then I run compodoc -p src/tsconfig.compodoc.json and the scan is working again for my entire project

It's clearly a workaround but it works for me...

I've tried to tell compodoc to scan src and use a specific tsconfig, with: compodoc src/ -p tsconfig.app.json but it doesn't work, I don't know why, according to compodoc documentation it should work (a bug from compodoc in parsing argument maybe ?)

Any news about this?
there is the same problem in angular 10 i ve' solved with @jdespatis solution but is only a workaround but im not able to exclude files and add files into.

I have updated the documentation

compodoc -p tsconfig.json src should do the trick for Angular 10+ projects

Here is my package.json's compodoc scripts for an Angular10 project:

{
  "scripts": {
    "build-docs": "npx compodoc src -p tsconfig.json -d ./dist/docs -n ngExcel-Documentation",
    "serve-docs": "npx compodoc -s -p tsconfig.json -d ./dist/docs -n ngExcel-Documentation -w" 
  },
}

the tsconfig.json file:

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "module": "esnext",
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "resolveJsonModule": true,
    "importHelpers": true,
    "target": "es2015",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ],
    "types": [
      "cypress-commands",
      "cypress",
      "node"
    ]
  }
}

edit:
In another angular10 project, my tsconfig.json looks different, but its tsconfig.base.json resembles it and works when pointed too in the npm script

@vogloblinsky I'm experiencing the same problem. I have an NX workspace and I'm using a .compodoc.json file for configuration.

{
  "name": "Web App",
  "tsconfig": "./tsconfig.json",
  "includes": "documentation_includes"
}

I've cd into my apps/web folder and I'm running: npx compodoc src -s -w (I've also tried without src)

Compodoc does not seem to pickup any of the src files:

[13:49:36] Using configuration file : /Users/oscarviquez/Code/zyyah/zyyah/apps/web/.compodocrc.json
[13:49:36] Using provided source folder
[13:49:36] Using tsconfig file : /Users/oscarviquez/Code/zyyah/zyyah/apps/web/tsconfig.json
[13:49:36] Searching package.json file
[13:49:36] Error during /Users/oscarviquez/Code/zyyah/zyyah/apps/web/package.json read
[13:49:36] Continuing without package.json file
[13:49:36] Searching README.md, CHANGELOG.md, CONTRIBUTING.md, LICENSE.md, TODO.md files
[13:49:36] README.md file found
[13:49:36] Error during /Users/oscarviquez/Code/zyyah/zyyah/apps/web/CHANGELOG read
[13:49:36] Continuing without CHANGELOG.md file
[13:49:36] Error during /Users/oscarviquez/Code/zyyah/zyyah/apps/web/CONTRIBUTING read
[13:49:36] Continuing without CONTRIBUTING.md file
[13:49:36] Error during /Users/oscarviquez/Code/zyyah/zyyah/apps/web/LICENSE read
[13:49:36] Continuing without LICENSE.md file
[13:49:36] TODO.md file found
[13:49:36] Get dependencies data
[13:49:36] -------------------
[13:49:36] Project statistics 
[13:49:36] -------------------
[13:49:36] Prepare components
[13:49:36] Prepare modules
[13:49:36] Process documentation coverage report
[13:49:36] Adding external markdown files
[13:49:36] Additional documentation: summary.json file found
[13:49:36] Process main graph
[13:49:36] Process pages
[13:49:36] Process page   : coverage
[13:49:36] Process page   : index
[13:49:36] Process page   : modules
[13:49:36] Process page   : overview
[13:49:36] Process page   : todo
[13:49:36] Process menu...
[13:49:37] Copy main resources
[13:49:37] Documentation generated in ./documentation/ in 0.42 seconds using gitbook theme
[13:49:37] Serving documentation from ./documentation/ at http://127.0.0.1:8080
[13:49:37] Watching sources in  folder

EDIT

If I use compodoc in my NX libraries it works just fine. The only difference is that the .compodoc.json points the tsconfig to .lib instead of .app

{
  "name": "API Library",
  "tsconfig": "./tsconfig.lib.json",
  "includes": "documentation_includes"
}

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

This issue has been automatically closed because it has not had recent activity. Please file a new issue if you are encountering a similar or related problem. Thank you for your contributions.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

jongunter picture jongunter  路  25Comments

pborregg picture pborregg  路  38Comments

ComFreek picture ComFreek  路  22Comments

rafapaulin picture rafapaulin  路  13Comments

realappie picture realappie  路  33Comments