How to configure angular-cli to create inline sourcemaps?

问题

angular.json only gives the option to turn on/off sourcemap generation but by default it's in separate files.

tsconfig.json gives also the inlineSources option but it's ignored by angular-cli.

Is there a way to tell angular-cli to write the source maps inside the .js?

回答1:

To whom it may concern, here is the approach I implemented to enable debugging with source maps support on Android devices

install ngx-build-plus by running npx ng add ngx-build-plus
This will install the required npm package and update angular.json as required For more details please see https://github.com/manfredsteyer/ngx-build-plus
create new file build-customization-plugin.js in the project root directory and add the below content in this file

var merge = require('webpack-merge');

exports.default = {
    config: function (cfg) {
        const strategy = merge.strategy({
            'devtool': 'replace',
        });

        return strategy(cfg, {
            devtool: 'inline-source-map'
        });
    }
}

run ng build --eval-source-map --plugin ~build-customization-plugin.js from the root directory to build the project with source maps to debug on Android devices

This is a better approach then changing angular/cli source as I described in a previous port :)

回答2:

This is not supported. To enable this I patched angular cli source code (i have @angular/cli version 7.0.0) to use inline-source-maps webpack option. To do so I changed one line in node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/browser.js file

sourcemaps = 'eval';

sourcemaps = 'inline-source-map';

来源：https://stackoverflow.com/questions/52499545/how-to-configure-angular-cli-to-create-inline-sourcemaps

标签

angular-cli

source-maps