Javascript 如何将TypeScript代码和JS库与源代码映射合并到一个文件中？

我可以使用以下方法成功地将我的TypeScript项目编译成一个带有源映射的JS文件：

tsc --sourcemap --out app.js app.ts

我还可以使用UglifyJS成功缩小该输出，同时保持源地图的完整性：

uglifyjs app.js --source-map app.js.map --in-source-map app.js.map -o app.js

不过，我想再进一步。我想将编译后的TypeScript代码（

app.js

）与两个第三方js库组合成一个缩小的文件，该文件维护指向原始TypeScript（对于我的代码）或JavaScript（对于第三方库）的源映射

我尝试了类似的方法，基本上只是将JS库文件添加到UglifyJS的输入中：

uglifyjs app.js lib/javascript-library.js --source-map app.js.map --in-source-map app.js.map -o app.js

不幸的是，这似乎不起作用。它确实成功地将所有内容合并到一个文件中，并且TypeScript代码的源映射似乎得到了保留。但是当我在

lib/javascript library.js

中输入错误时，我浏览器中的js控制台（使用源代码映射）说错误在我的一个TypeScript文件中，这显然是错误的

---

我是一个TypeScript新手，我无法想象我是第一个想要将TS输出与随机JS库结合在一个带有源代码映射的缩小文件中的人，但我找不到任何人谈论它。所以，也许我的方法完全错了？

Typescript编译器不是那么聪明，要做到这一点，您需要使用更具体的工具。示例：

要求（如果您知道gulpjs，请跳过此项）：

安装

运行以下命令：

npm安装-g typescript gulp

以安装gulp taskrunner

在项目目录中，运行

npm init

并按照说明创建package.json

运行：

npm安装gulp gulp typescript gulp concat gulp uglify gulp sourcemaps--保存dev

以安装，e工具

创建名为gulpfile.js的文件

在gulpfile.js中定义“编译”任务：

var gulp = require('gulp');
var ts = require('gulp-typescript');
var concat = require('gulp-concat');
var sourcemaps = require('gulp-sourcemaps');
var uglify = require('gulp-uglify');

gulp.task('compile', function() {
     var tsResult = gulp.src('app.ts')
        .pipe(sourcemaps.init()) // This means sourcemaps will be generated 
        .pipe(ts({
             sortOutput: true,
                       // ... 
         }));

      return tsResult
         .pipe(concat('lib/js-library.js')) // You can use other plugins that also support gulp-sourcemaps
         .pipe(uglify()) 
         .pipe(sourcemaps.write()) // Now the sourcemaps are added to the .js file 
         .pipe(gulp.dest('release/'));
});

现在，运行

gulpcompile

，看看它的神奇之处

了解此软件包并构建自定义任务编译。

可能相关：也许我的答案会对某人有所帮助。