[英]gulp-typescript with gulp-sourcemap: output files to same directory
I'm using gulp-typescript
and gulp-sourcemaps
to compile TypeScript with sourcemaps. 我使用的是
gulp-typescript
及gulp-sourcemaps
编译与sourcemaps打字稿。 I want to output both the .js
and the source map files to the same directory as the original .ts
file. 我想将
.js
和源映射文件输出到与原始.ts
文件相同的目录。
I'm using a tsconfig.json
file to configure TypeScript, and I'm using typings
for managing TypeScript definition files. 我正在使用
tsconfig.json
文件来配置TypeScript,我正在使用typings
来管理TypeScript定义文件。 All of my own code is in the js
directory. 我自己的所有代码都在
js
目录中。 Here's my project structure: 这是我的项目结构:
project root
|-- js/
| |-- subdir/
| | |-- someScript.ts
| |-- app.ts
|-- typings/
| |-- someDefinitionFile.d.ts
|-- gulpfile.js
|-- tsconfig.json
Now I would like app.js
to appear in the js
directory, and someScript.js
to appear in js/subdir
. 现在我希望
app.js
出现在js
目录中, someScript.js
出现在js/subdir
。 Plus, when debugging in Chrome, I would like to keep the same folder structure in the 'Sources' tab. 另外,在Chrome中进行调试时,我希望在“来源”标签中保留相同的文件夹结构。
I've configured the following gulp task for this: 我为此配置了以下gulp任务:
var gulp = require("gulp");
var ts = require("gulp-typescript");
var tsProject = ts.createProject("tsconfig.json");
var sourcemaps = require('gulp-sourcemaps');
gulp.task("ts", function () {
var tsResult = tsProject
.src()
.pipe(sourcemaps.init())
.pipe(ts(tsProject)).js
.pipe(sourcemaps.write("."))
.pipe(gulp.dest("js"));
});
This effectively outputs the .js
files in the correct directories. 这有效地将
.js
文件输出到正确的目录中。 However, when running this in Chrome and opening Development tools, the .ts
files are located in a 'source' directory under the root, meaning the source map files contain an incorrect root. 但是,在Chrome中运行此功能并打开开发工具时,
.ts
文件位于根目录下的“源”目录中,这意味着源映射文件包含不正确的根目录。
What should be changed to show the .ts
files and the .js
files in the same location? 应该更改什么来显示
.ts
文件和.js
文件在同一位置?
Note: this question is similar to this one, except that I want to use tsconfig.json
, and thus cannot use gulp.src
or its base
property. 注意:这个问题类似于这个 ,除了我想使用
tsconfig.json
,因此不能使用gulp.src
或其base
属性。
Just set the sourceRoot
property of the gulp-sourcemap write options. 只需设置
sourceRoot
-sourcemap写入选项的sourceRoot
属性即可。 This task works: 此任务有效:
gulp.task("ts", function () {
tsProject.src()
.pipe(sourcemaps.init())
.pipe(ts(tsProject)).js
.pipe(sourcemaps.write({sourceRoot: "/js"}))
.pipe(gulp.dest("js"));
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.