相关疑难解决方法(0)

如何使用angular-cli webpack调试角度app?

之前我使用angular-cli@1.0.0-beta.10,现在我更新到angular-cli @ webpack beta.11.经过大量的自定义更改,我得到了它的工作.

唯一的问题是,现在我无法使用webstorm和chrome调试器调试我的角度应用程序,因为我没有使用ng服务获取任何ts文件.使用angular-cli@1.0.0-beta.10,使用Jetbrains插件调试我的应用程序非常容易.

如何使用Web服务调试我的角度应用程序和使用ng服务的Chrome调试器?

intellij-idea google-chrome-devtools typescript angular-cli angular

47
推荐指数
2
解决办法
2万
查看次数

使用chrome web开发人员工具在Angular 2 CLI项目中未显示的Typescript文件

我使用angular2 CLI(ember cli)生成了一个打字稿项目.我正在使用Chromium Web Developer工具进行调试.我在开发者工具设置中选择了"启用javascript源地图".我看到源视图中列出的.js文件和.ts.但是,当我选择它们时,.ts(typescript)文件显示为空,即它无法找到它们.

屏幕打印显示情况:

在此输入图像描述

如果我选择它们,我可以看到.js文件的文本.

.ts文件没有被复制到dist目录中,这对我来说似乎是一个问题,但我看到其他地方的例子显示了典型的angular2 cli dist结构,它们也没有.ts文件.

我的"tsconfig.json"的相关部分显示我启用了源映射:

 1   "compileOnSave": false,                                                                            
  2   "compilerOptions": {                                                                               
  3     "declaration": false,                                                                            
  4     "emitDecoratorMetadata": true,                                                                   
  5     "experimentalDecorators": true,                                                                  
  6     "mapRoot": "",                                                                                   
  7     "module": "system",                                                                              
  8     "moduleResolution": "node",                                                                      
  9     "noEmitOnError": true,                                                                           
 10     "noImplicitAny": false,                                                                          
 11     "outDir": "../dist/",                                                                            
 12     "rootDir": ".",                                                                                  
 13     "sourceMap": true,                                                                               
 14     "sourceRoot": "/",                                                                               
 15     "target": "es5"                                                                                  
 16   },                          
Run Code Online (Sandbox Code Playgroud)

js.map文件制作和驻留在DIST目录旁边的.js文件.

映射文件示例(部分):

{"version":3,"file":"app.js","sourceRoot":"/","sources":["app.ts"],"names":[],"mappings":";;;;;;;;;;;;;YAGA,mB
Run Code Online (Sandbox Code Playgroud)

我试过:
1)将.ts文件从src复制到dist.
2)手动编辑app.js.map文件的各种尝试,例如sourceRootsources.

目前还不十分清楚js.map文件中的"/"是什么:项目的src目录还是dist目录?如果我编辑.js.map文件,我是否必须刷新浏览器以获取它?

我认为基本问题是它在src目录中寻找ts文件,这超出了浏览器的范围(因为它位于"../src"). …

typescript angular-cli angular

10
推荐指数
1
解决办法
7304
查看次数

Angular-CLI sass源地图

ng服务编译我的应用程序,但是当我检查html时,CSS的来源似乎是(样式)...(/ style).有谁知道如何通过Angular-CLI配置sass源映射?

sass scss-lint angular-cli angular

9
推荐指数
1
解决办法
2958
查看次数