Source: https://blog.angularindepth.com/debug-angular-apps-in-production-without-revealing-source-maps-ab4a235edd85

Build application with source map:

"build": "ng build --prod --source-map",

But now the source maps would be revealed in production. To hide them we simply create another folder in our dist and move the source maps to it.

"postbuild": "mkdir dist/sourceMapInspector/sourceMaps; mv dist/sourceMapInspector/*.map dist/sourceMapInspector/sourceMaps"

In production, we can find the source map by manully enter the source map url on server, then use 'Add source map' from Chrome dev tool to add source map in our production app.

Then we can debug it as normal as in the developement env.

[Angular] Debug Angular apps in production without revealing source maps的更多相关文章

  1. ASP.NET Core 2.1 Web API + Identity Server 4 + Angular 6 + Angular Material 实战小项目视频

    视频简介 ASP.NET Core Web API + Angular 6的教学视频 我是后端开发人员, 前端的Angular部分讲的比较差一些, 可以直接看代码!!!! 这是一个小项目的实战视频, ...

  2. angular 2 angular quick start Could not find HammerJS

    Angular2 的material中 引用了 hammerjs,遇到Could not find HammerJS错误,正确的步骤如下: 需要在如下位置增加 对material 和 hammerjs ...

  3. [AngualrJS + Webpack] Production Source Maps

    When you uglify your Angular code with Webpack's uglify plugin, debugging your application can be a ...

  4. php angular/think angular/php模版引擎

    在thinphp5中发现一个好用的模版引擎—think-angular, 此模板引擎主要特点是 不需要额外的标签定义, 全部使用属性定义, 写好的模板文件在IDE格式化代码的时候很整洁, 因为套完的模 ...

  5. angular+selecte2(angular ng-repeat渲染)

    一.页面代码 <select id="sponsorId" select2 ng-model="sponsorSelectedObj" ng-change ...

  6. [Angular 2] Angular 2 Smart Components vs Presentation Components

    Both Smart Components and Presentation Components receive data from Services in entirely different w ...

  7. Intergate flot with Angular js ——Angular 图形报表

    下面这篇文章最终的结论就是 Flot 插件 结合 Angular 的Directive 来处理 图表的绘制 给出github上的一个demo源码.https://gist.github.com/fly ...

  8. Angular - - ngRoute Angular自带的路由

    ngRoute $routeProvider 配置路由的时候使用. 方法: when(path,route); 在$route服务里添加一个新的路由. path:该路由的路径. route:路由映射信 ...

  9. @angular/cli (angular脚手架) 如何降级

    1.卸载 npm uninstall -g @angular/cli 2.清除缓存 npm cache verify 3.查看是否卸载成功 ng v //如果显示ng 不是内部或外部的指令 则证明卸载 ...

随机推荐

  1. Python之多线程:线程互斥与线程同步

    一.锁在多线程中的使用:线程互斥 lock = threading.Lock()#创建一个锁对象 1.with lock: pass 和进程使用的方式相同   2.控制线程结束的时间 通过一个全局变量 ...

  2. 转:android service总结

    1.Service的种类   按运行地点分类: 类别 区别  优点 缺点   应用 本地服务(Local) 该服务依附在主进程上,  服务依附在主进程上而不是独立的进程,这样在一定程度上节约了资源,另 ...

  3. 理想中的SQL语句条件拼接方式

    背景 Orm用过一些,但处理增删改上面做的都不错.但是查询上跟我想要的效果总是差了一点.我想要的效果则是这样,基于某种命名规则进行传参,后台解析器知道命名规则即可知道它要查询什么样的数据. 谈谈我之前 ...

  4. VIM使用系列: 复制并移动文本

    1 5. 复制并移动文本 *copy-move* 2 3 *quote* 4 "{a-zA-Z0-9.%#:-"} 指定下次的删除.抽出和放置命令使用的寄存器 5 {a-zA-Z0 ...

  5. /proc/sys/shm/drop_caches

    author:skate time:2012/02/22 手工释放linux内存--/proc/sys/vm/drop_cache 转载一篇文章 linux的内存查看: [root@localhost ...

  6. postman的使用(转载)

    Postman介绍 Postman是google开发的一款功能强大的网页调试与发送网页HTTP请求,并能运行测试用例的的Chrome插件.其主要功能包括: 模拟各种HTTP requests 从常用的 ...

  7. Android视频压缩并且上传

    一,做视频上传首先第一步要从相册里选取视频,这一步.我的上篇博客中已经讲过了. protected void onActivityResult(int requestCode, int resultC ...

  8. 第十四届华中科技大学程序设计竞赛 K Walking in the Forest【二分答案/最小化最大值】

    链接:https://www.nowcoder.com/acm/contest/106/K 来源:牛客网 题目描述 It's universally acknowledged that there'r ...

  9. HDU 6240 Server(2017 CCPC哈尔滨站 K题,01分数规划 + 树状数组优化DP)

    题目链接  2017 CCPC Harbin Problem K 题意  给定若干物品,每个物品可以覆盖一个区间.现在要覆盖区间$[1, t]$. 求选出来的物品的$\frac{∑a_{i}}{∑b_ ...

  10. rsync + inotify 同步

    1. 配置rysnc server:同步机,同步被同步机更新的文件,很多台vi /etc/rsyncd.conf uid=rootgid=rootuse chroot=nomax connection ...