sourcemaps not working since 1.0.0 release

Bug Report or Feature Request (mark with an x)

- [ x ] bug report -> please search issues before submitting
- [ ] feature request

Versions.

@angular/cli: 1.0.1
node: 7.7.4
os: darwin x64

Repro steps.

ng build --watch -op=/myoutputfolder --base-href=/myhref --target=production --sourcemaps

The log given by the failure.

none

Desired functionality.

working sourcemaps that have accurate breakpoints

Mention any other details that might be useful.

Ever since the 1.0.0 release of angular-cli, my sourcemaps have stopped working. They get generated, but any breakpoints that I attempt to set are useless and never get hit. It is clear to me that the lines I am seeing in the Chrome debugger are not matching up with the generated sourcemaps. About 1/2 the time, when I open a source file in the debugger and set a breakpoint, it jumps to a bundle file with everything on a single line and then freezes up Chrome to the point where I have to force kill it and restart.

Back when I was using 1.0.0rc4 of angular-cli, the sourcemaps worked great. However once everything went 1.0.0, they immediately stopped working and all sourcemaps that were generated would not work correctly. I could not set breakpoints, I could not evaluate any variables by holding the mouse over them, nor could I evaluate anything with watches or console evaluations.

If I do a non-production build, the sourcemaps work just fine. It is very possible that I’m just not creating them correctly. However, troubleshooting the sourcemaps is very difficult given that webpack configurations are hidden and the angular-cli options for creating sourcemaps are limited… I’m pasting my project files below in case that helps.

Any help is GREATLY appreciated!

package.json

{
  "name": "navigate",
  "version": "0.0.0",
  "license": "MIT",
  "angular-cli": {},
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "aot-compile": "./node_modules/.bin/ngc -p ./src/tsconfig-aot.json",
    "lint": "ng lint",
    "test": "ng test",
    "pree2e": "webdriver-manager update",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "4.0.3",
    "@angular/cli": "^1.0.1",
    "@angular/common": "4.0.3",
    "@angular/compiler": "4.0.3",
    "@angular/compiler-cli": "4.0.3",
    "@angular/core": "4.0.3",
    "@angular/forms": "4.0.3",
    "@angular/http": "4.0.3",
    "@angular/platform-browser": "4.0.3",
    "@angular/platform-browser-dynamic": "4.0.3",
    "@angular/platform-server": "4.0.3",
    "@angular/router": "4.0.3",
    "@ngui/datetime-picker": "0.16.2",
    "@types/greensock": "1.15.32",
    "@types/gsap": "1.19.1",
    "@types/lodash": "4.14.63",
    "ag-grid": "9.0.3",
    "ag-grid-angular": "9.0.3",
    "angular2-fontawesome": "0.9.0",
    "angular2-uuid": "1.1.1",
    "awesome-typescript-loader": "3.1.2",
    "bootstrap": "3.3.7",
    "core-js": "2.4.1",
    "d3": "4.8.0",
    "font-awesome": "4.7.0",
    "gsap": "1.19.1",
    "jquery": "3.2.1",
    "lodash": "4.17.4",
    "moment": "2.18.1",
    "mydatepicker": "1.9.11",
    "ng2-bootstrap": "1.6.3",
    "ng2-logger": "1.0.2",
    "ng2-toastr": "4.0.1",
    "ngx-color-picker": "4.0.0",
    "ngx-cookie": "1.0.0",
    "primeng": "4.0.0-rc.3",
    "primeui": "4.1.15",
    "reflect-metadata": "0.1.10",
    "rxjs": "5.3.0",
    "symbol-observable": "1.0.4",
    "tether": "1.4.0",
    "ts-helpers": "1.1.2",
    "typescript-collections": "1.2.3",
    "zone.js": "0.8.9"
  },
  "devDependencies": {
    "@angular/cli": "1.0.1",
    "@angular/compiler-cli": "4.0.3",
    "@ngtools/webpack": "1.3.1",
    "@angular/language-service": "4.0.3",
    "@types/chai": "3.5.1",
    "@types/d3": "4.8.0",
    "@types/jasmine": "2.5.47",
    "@types/protractor": "4.0.0",
    "codelyzer": "3.0.0",
    "jasmine-core": "2.6.0",
    "jasmine-spec-reporter": "4.0.0",
    "karma": "1.6.0",
    "karma-chrome-launcher": "2.0.0",
    "karma-cli": "1.0.1",
    "karma-jasmine": "1.1.0",
    "karma-remap-istanbul": "0.6.0",
    "protractor": "5.1.1",
    "source-map-explorer": "1.3.3",
    "ts-node": "3.0.2",
    "tslint": "5.1.0",
    "typescript": "2.2.2",
    "webdriver-manager": "12.0.5"
  }
}

.angular-cli.json

{
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "project": {
        "name": "navigate"
    },
    "apps": [
        {
            "root": "src",
            "outDir": "dist",
            "assets": [
                "assets",
                "index.jsp",
                "WEB-INF",
                "META-INF"
            ],
            "index": "index.html",
            "main": "main.ts",
            "polyfills": "polyfills.ts",
            "test": "test.ts",
            "tsconfig": "tsconfig.app.json",
            "prefix": "app",
            "styles": [
                "../node_modules/ag-grid/dist/styles/ag-grid.css",
                "../node_modules/ag-grid/dist/styles/theme-dark.css",
                "../node_modules/ag-grid/dist/styles/theme-material.css",
                "../node_modules/ag-grid/dist/styles/theme-bootstrap.css",
                "../node_modules/tether/dist/css/tether.min.css",
                "../node_modules/bootstrap/dist/css/bootstrap.min.css",
                "../node_modules/primeui/themes/bootstrap/theme.css",
                "../node_modules/font-awesome/css/font-awesome.min.css",
                "../node_modules/primeui/primeui-ng-all.css",
                "../node_modules/ng2-toastr/ng2-toastr.css",
                "styles.css"
            ],
            "scripts": [
                "../node_modules/jquery/dist/jquery.min.js",
                "../node_modules/moment/min/moment.min.js",
                "../node_modules/bootstrap/dist/js/bootstrap.min.js",
                "../node_modules/tether/dist/js/tether.min.js",
                "../node_modules/gsap/src/minified/TweenMax.min.js",
                "../node_modules/gsap/src/minified/TimelineMax.min.js",
                "assets/scripts/vendor/odoo/odoo.js",
                "assets/scripts/vendor/modernizr/modernizr-custom.min.js"
            ],
            "environmentSource": "environments/environment.ts",
            "environments": {
                "dev": "environments/environment.ts",
                "prod": "environments/environment.prod.ts"
            }
        }
    ],
    "addons": [],
    "packages": [
        {
            "odoo": {
                "defaultExtension": "js",
                "main": "odoo.js"
            },
            "modernizr": {
                "defaultExtension": "js",
                "main": "modernizer.min.js"
            },
            "gsap": {
                "defaultExtension": "js",
                "main": "TweenMax.min.js"
            }
        }
    ],
    "e2e": {
        "protractor": {
            "config": "./protractor.conf.js"
        }
    },
  "lint": [
    {
      "files": "src/**/*.ts",
      "project": "src/tsconfig.app.json"
    }
  ],
    "test": {
        "karma": {
            "config": "./karma.conf.js"
        }
    },
    "defaults": {
        "styleExt": "css",
        "prefixInterfaces": false,
        "inline": {
          "style": false,
          "template": false
        },
        "spec": {
          "class": false,
          "component": true,
          "directive": true,
          "module": false,
          "pipe": true,
          "service": true
        }
    }
}

main.ts

import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
import {enableProdMode} from '@angular/core';
import {environment} from './environments/environment';
import {AppModule} from './app/app.module';
import {Log, Level} from 'ng2-logger';
import 'gsap';

const log = Log.create('log');
let url = window.parent.parent.parent.location.href;  // @TODO: fix this to be more robust
if (url.indexOf('betaMode') > -1) {
    window['beta'] = true;
}
if ((environment.production && url.indexOf('debug') < 0)
     ||
     (url.indexOf('production') > -1)) {
    enableProdMode();
    Log.setProductionMode();
} else {
    log.i('RUNNING IN DEVELOPMENT MODE');
}
platformBrowserDynamic().bootstrapModule(AppModule);

tsconfig.app.json

{
  "compilerOptions": {
    "baseUrl": "",
    "declaration": false,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "lib": ["es6", "dom"],
    "mapRoot": "../",
    "module": "commonjs",
    "moduleResolution": "node",
    "outDir": "../dist",
    "sourceMap": true,
    "target": "es5",
    "typeRoots": [
      "../node_modules/@types",
      "src/typings"
    ]
  }
}

[ddehghan]

it seems that they added a new option to turn off sourcemaps in prod build. I get the source maps generated on cli v 1.0.3 using this:

ng build --prod --aot false --sourcemap --environment=prod --base-href=/dist/index.html

[sumitarora]

@billdwhite Seems to be an issue with UglifyJsPlugin webpack plugin. Removing that and running the prod build works fine and I can see the breakpoints and work with them.