What are source maps

Source maps are additional files generated during the build process that map the compiled JavaScript code back to the original source files, such as TypeScript, SCSS, or templates.

They help developers debug applications more effectively because browser developer tools can show the original source code instead of only the transformed build output. This makes it easier to understand stack traces, inspect application behavior, and identify the root cause of issues.

Recommendation for source map usage

For consuming applications, source maps should usually be:

  • enabled in development

  • optionally enabled in test or staging environments

  • disabled in production, unless there is a specific need for them and the security implications have been carefully considered

How to enable source maps

The exact configuration depends on how each application is built.

For Angular applications, see the official Angular documentation:

For Nx-based applications, see the official Nx documentation:

Enabling source maps in the shell

It is recommended to also enable source maps in the shell during development, as this allows to debug both the shell and the integrated application together more effectively.

Since packages are shared at runtime between the shell and applications, having source maps enabled in the shell can provide better insights into the shared dependencies and their interactions.

That way its possible to avoid potential minification issues that can arise when the shell is built without source maps while the application is built with source maps.

For more information on how to enable source maps in the shell, see Enable shell source maps guide.

Security and operations note

Source maps may expose implementation details. Do not enable public production access without explicit review.