使用Typescript 1.8,Gulp 3.9.0,gulp-sourcemaps 1.6.0和tsconfig.json文件.
在一段时间以前,这是很好的.最近(我无法确定什么时候),Chrome和Firefox都不会真正使用sourcemap.
我已经在Chrome上启用了源代码映射,并认识到有一个源代码映射,在控制台中告诉我:
“源映射检测到相关文件应该添加到文件树中,您可以将这些解析的源文件作为常规JavaScript文件进行调试,相关文件可通过文件树或Ctrl P”
在本地构建上构建文件结构(仅使用Login作为示例):
build |- resources |- js |- app.js |- app.js.map |- typescript |- app.ts |- sections |- login |- LoginService.ts |- LoginDirective.ts |- LoginController.ts
build |- resources |- js |- app.js
而已.没有Typescript文件夹,没有文件. Ctrl-P也没有找到它们.所以当我调试时,我只能调试编译的app.js文件,而不是看到Typescript代码.
我的gulp文件相关部分:
var ts = require( 'gulp-typescript' ); // compiles typescript var tsProject = ts.createProject( 'tsconfig.json' ); gulp.task( 'compile:typescript',function () { var tsResult = tsProject .src() // instead of gulp.src(...) .pipe( sourcemaps.init() ) .pipe( ts( tsProject ) ); return tsResult.js .pipe( sourcemaps.write( '.',{ includeContent: false,sourceRoot: 'typescript' }) ) .pipe( './build' ) ; } );
我已经查看了类似情况的各种文档和解决方案,但我仍然没有让Chrome使用源代码图.
https://www.npmjs.com/package/gulp-sourcemaps
https://github.com/ivogabe/gulp-typescript/issues/201
https://github.com/floridoo/gulp-sourcemaps/issues/89#issuecomment-73184103
gulp-typescript: Problems using createProject …“还有更多!”
不知道为什么这不能正常工作.任何见解,堆垛机?
解决方法
我相信你的问题在于你如何定义sourceRoot.尝试像sourceRoot:’./typescript/’.