How to generate optimized sources with and without sourcemaps for production use?

Discussão em 'Angular' iniciado por oli0060, Novembro 30, 2024.

  1. oli0060

    oli0060 Guest

    I'm trying to get my head around the usage of sourceMaps to resolve stack traces from production errors in angular.

    I want to ship the optimized sources from dist/* generated by ng build --configuration=production obviously without the generated `.js.map files. At the same time I want to generate/use the `*.js.map` sources to resolve production stack traces.

    However, I don't want to write a custom script to remove the `*.js.map` from the dist directory after the build is complete as this is error prone.

    I thought I can do this in two steps:


    1. Generate the production sources without the source maps. This is then shipped to production


    2. If a production error occurs: generate the production chuncks again. This time including the source maps.

    The problem that I'm now facing is that the generated .js have different hashes. I use "hidden": true to remove the sourceMappingUrl from the generated files. I would expect that the hidden field would prevent that the file contents / hashes changes. What am I missing?

    https://angular.dev/reference/configs/workspace-config#source-map-configuration

    Production Configuration for Production Compilation:

    "production": {
    "fileReplacements": [
    {
    "replace": "src/environments/environment.ts",
    "with": "src/environments/environment.prod.ts"
    }
    ],
    "optimization": true,
    "outputHashing": "all",
    "sourceMap": {
    "scripts": false,
    "styles": false,
    "hidden": true,
    "vendor": false
    },
    "namedChunks": false,
    "aot": true,
    "extractLicenses": true,
    "vendorChunk": false,
    "buildOptimizer": true,
    "budgets": [
    {
    "type": "initial",
    "maximumWarning": "2mb",
    "maximumError": "5mb"
    }
    ]
    },


    To generate the source maps I use the same configuration and only change the sourceMap configuration as follows:

    "sourceMap": {
    "scripts": true,
    "styles": true,
    "hidden": true,
    "vendor": false
    },


    The generated output than differs, e.g.

    59.10d4343a556f9106.js | component-1-module | 4.41 kB | 1.61 kB

    59.e2a4f51b3ab8de9e.js | component-1-module | 4.41 kB | 1.63 kB

    Using "@angular/cli": "^17.3.8",

    Continue reading...

Compartilhe esta Página