Some typescript import errors around missing files

[bollwyvl]

Description

Congratulations on 11.0.0 🎉 !

When building running tsc on some code that imports mermaid

  ../../node_modules/mermaid/dist/rendering-util/render.d.ts(1,26): error TS2307: Cannot find module '$root/diagram-api/types.js' or its corresponding type declarations.
  ../../node_modules/mermaid/dist/rendering-util/render.d.ts(2,38): error TS2307: Cannot find module '$root/internals.js' or its corresponding type declarations.
  ../../node_modules/mermaid/dist/rendering-util/render.d.ts(3,33): error TS2307: Cannot find module './types.js' or its corresponding type declarations.
  ../../node_modules/mermaid/dist/mermaid.d.ts(10,33): error TS2307: Cannot find module './rendering-util/types.js' or its corresponding type declarations.

Steps to reproduce

Here is a minimal reproducer, but can confirm by inspection rendering-utils/types.d.js is not present in https://registry.npmjs.org/mermaid/-/mermaid-11.0.0.tgz . The $root stuff looks plain wrong.

Screenshots

No response

Code Sample

https://gist.github.com/bollwyvl/00b49e5119fe8115c2bf606e5c669a31

Setup

• Mermaid version: 11.0.0
• Browser and Version: [Chrome, Edge, Firefox] (havne't gotten here yet)

Suggested Solutions

• include the missing .d.ts files
• see if the $root pattern can be replaced with
  • more-consistent (albeit verbose) relative imports, or
  • further package splitting

Additional Context

Adding skipLibCheck makes this "work," but is infeasible for many projects.

[bollwyvl]

This issue persists with the latest releases.

[bollwyvl]

#5798 addresses the missing file part of this.

It appears the paths: {$root} alias in tsconfig.json is apparently intractable to solve use stock tsc and still provide useful types to downstreams without further configuration.

Options to fix this would would include:

1. replace the ~100 instances with their relative paths, which get are properly understood by all tooling
2. use a downstream-transparent pattern, e.g.

"paths": {"mermaid/dist/*": ["src/*"]}

3. use a tsc wrapper (there are several, but I can't really recommend any of them)
4. use a post-processor (similar to the above)

While the second option appears to work, as a downstream consumer I'd really favor the first option, as anything else is liable to become more brittle over time.

However this is solved, a CI job that does a full build of the .tgz files and does something akin to the above-linked gist would help ensure the library stays consumable by downstreams.

[bollwyvl]

#5805 offers a full, tested proposal, implementing option 2 from the above comment.

[sidharthv96]

@bollwyvl it's out in v11.2.0!
Thanks for the effort.

[bollwyvl]

Thanks. Perhaps a @mermaid-js/layout-elk which includes the #5798 typing changes would also be needed?

[sidharthv96]

Ohh, didn't notice there was no changeset for that.
Will do.

[sidharthv96]

Done