包含多个bundle和sourcemap的gulp typescript
我正在从事一个typescript项目,我需要创建两个不同的JS捆绑包,一个用于管理,另一个用于其他所有内容,并为每个捆绑包生成源映射。我一直在尝试从GulpTypeScript克隆js流,然后过滤出与捆绑包相关的文件,然后合并流并编写源映射。但是,在运行任务后,不会创建捆绑包 gulpfile.js包含多个bundle和sourcemap的gulp typescript,typescript,gulp,gulp-sourcemaps,gulp-typescript,Typescript,Gulp,Gulp Sourcemaps,Gulp Typescript,我正在从事一个typescript项目,我需要创建两个不同的JS捆绑包,一个用于管理,另一个用于其他所有内容,并为每个捆绑包生成源映射。我一直在尝试从GulpTypeScript克隆js流,然后过滤出与捆绑包相关的文件,然后合并流并编写源映射。但是,在运行任务后,不会创建捆绑包 gulpfile.js var config = { src: { ts:['./Content/Scripts/TypeScript/**/*.ts'] }, bundles:
var config = {
src: {
ts:['./Content/Scripts/TypeScript/**/*.ts']
},
bundles: {
dashboard: [
'**/Controller/Widgets/**/*.js',
'**/Services/Widgets/**/*.js'
],
core: [
'**/Common/**/*.js',
'**/Server/**/*.js',
'**/Controller/Search/**/*.js'
]
}
}
gulp.task('build-ts', function () {
var tsResult = gulp.src(config.src.ts)
.pipe(srcMap.init())
.pipe(tsProj());
var bundleStreams = [
tsResult.js
.pipe(clone())
.pipe(filter(config.bundles.core))
.pipe(concat(config.outFiles.bundles.core)),
tsResult.js
.pipe(clone())
.pipe(filter(config.bundles.dashboard))
.pipe(concat(config.outFiles.bundles.dashboard))
];
return merge([
merge(bundleStreams)
.pipe(srcMap.write())
.pipe(gulp.dest(config.dist.main)),
tsResult.dts
.pipe(concat(config.outFiles.typeDef))
.pipe(gulp.dest(config.dist.main))
]);
});
package.json
{
"devDependencies": {
"gulp": "^3.9.1",
"gulp-clone": "^1.0.0",
"gulp-concat": "^2.6.1",
"gulp-filter": "^5.0.0",
"gulp-sourcemaps": "^2.4.1",
"gulp-typescript": "^3.1.4",
"merge2": "^1.0.3",
"typescript": "2.2.1"
},
}
注意:源typescript文件使用的是名称空间而不是模块。一种快速而简单的方法是独立编译每个包,只向
gulp.src()
提供每个包所需的文件。typescript编译器将通过获取您在gulp.src()
这种方法可能会导致每个bundle上的代码重复。如果这对您来说是一个问题,我的方法是创建两个不同的项目(一个用于管理,另一个用于其他一切)。您可能在两个bundle之间共享了代码,因此,如果是这样,我将创建第三个项目来共享代码
每个项目都可以有自己的包和各自的源地图。您可以将每个项目视为不同的npm包
希望这能帮助你,
顺致敬意,
jpsfs谢谢你的建议,理想情况下我只想打一次电话给tsc
,但是有备份很好