19

ng build of angular-cli creates 3 files:

inline.bundle.js
vendor.bundle.js
main.bundle.js

and also a map file for each own. What for?

I am also asking if there is a way to change that behavior, not creating these 3 files but copy to dist directory all the js files, not bundle anything. Is that possible?

Claies
  • 22,124
  • 4
  • 53
  • 77
AngularOne
  • 2,760
  • 6
  • 32
  • 46
  • source maps, for debugging – reptilicus Feb 08 '17 at 16:40
  • what do you mean? these files are all the js code around the project, are the map will let me debug the code as I wrote it, or the compile code from (changed from ts to js)? – AngularOne Feb 08 '17 at 16:41
  • 1
    TypeScript transpiles your code into something that will work in a browser, as browsers don't run TypeScript. The map files point that code (in the browser) to the actual source files that are written in TS. That makes it easier to figure out at what line in the actual source things are going wrong. – reptilicus Feb 08 '17 at 16:48

3 Answers3

35

.map files are used for debugging your application. It is not related with angular-cli and is feature of typescript compiler, you may set\unset in tsconfig file like below,

 "sourceMap": true\false

Hope this helps!!

Madhu Ranjan
  • 17,334
  • 7
  • 60
  • 69
  • 1
    I would add, however, that you probably do not want to turn them off! – reptilicus Feb 08 '17 at 19:25
  • 3
    But once i ran ,`ng build --aot --prod` angular will automatically remove `.map` files , i haven't set `sourceMap` to `false` yet. how's it possible any comments on this ? – Pardeep Jain Sep 13 '17 at 06:02
  • also can you please elaborate bit more what does it mean exactly by `...debugging your application` ? debugging in what terms ? – Pardeep Jain Sep 13 '17 at 06:04
  • @PardeepJain, well when cli minify your code , it is hard to debug and sourcemap enables you do the same by creating a link between your minified JS and source JS\typescript , read more about it [here](https://www.html5rocks.com/en/tutorials/developertools/sourcemaps/). – Madhu Ranjan Sep 13 '17 at 12:40
  • 2
    @PardeepJain, For `ng build --aot --prod` , Angular CLI configures so that source map is not generated in production mode, you may see all the default settings which are applied [here explaining --dev vs --prod builds](https://github.com/angular/angular-cli/wiki/build#--dev-vs---prod-builds) – Madhu Ranjan Sep 13 '17 at 12:43
  • Hi, where it saves the relevant *.map for using in Internet Explorer, for example? – Aa Yy Apr 16 '18 at 16:03
9

@Madhu's answers disables it for any ng build command. If you want to conditionally or temporarily disable it from your builds run:

Angular 8

ng build --watch --source-map=true/false

Angular 7

ng build --watch --sourcemaps=true/false

Angular 6

ng build --watch --no-sourcemap

Phil
  • 10,948
  • 17
  • 69
  • 101
0

Below command will not generate the source files while generating the build:

>ng build --prod -sm false

and if you want to generate the source files the use below command:

>ng build --prod -sm true

Here is the screenshot:

enter image description here

Swapnil G Thaware
  • 799
  • 3
  • 6
  • 19