私はjavascriptと今はtypescriptのための良いgulpブラウザワークフローを持っています。これらは、ソースファイルとモジュールを結合し、ブラウザで使用する単一の.jsファイルを生成します。gulpブラウザでjavascriptとtypescriptを混ぜる
しかし、以前のjavascriptプロジェクトでは、すべてをtypescriptに変換せずに、typescriptを使用して新しい機能を導入したかったのです。
理想的には私が検出するbrowserify、プリコンパイルTSとTSX、そしてbrowserifying前バベルするJS-ファイルと一緒に結果を渡したい:
function compileBrowserify(file, folder, watch, typescript) {
// cache and packageCache is required for watchify to perform, debug produces sourcemaps. })
var bundlerRaw = browserify(file, { debug: true, cache: {}, packageCache: {}})
var bundler = watch ? watchify(bundlerRaw) : bundlerRaw
bundler = typescript ? bundler.plugin(tsify, { noImplicitAny: false, jsx: 'react', moduleResolution: 'node', target: 'ES6'}) : bundler
bundler.transform(babelify.configure({
presets: ['react', 'es2015', 'stage-0'],
}))
var rebundle = function() {
return bundler
.bundle()
.on('error', function(err) { console.error(err.toString()); this.emit('end'); })
.on('end', function() { console.log('Done browserifying'); })
.pipe(source("app/main.js"))
.pipe(buffer())
.pipe(sourcemaps.init({ loadMaps: true }))
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest(folder));
}
bundler.on('update', rebundle)
return rebundle()
}
このセットアップは、実際にJS-部分のコンパイルと動作します私のタイスクリプトファイルはバンドルされていません。 既存のjavascriptプロジェクトにtypescriptファイルを追加することは可能ですか?
注:現時点ではReact tsxファイルを追加していますが、通常のtsファイルの場合は同じと仮定します。
注:tsxファイルをブラウザのバンドルに手作業で追加()しようとしましたが、何の期待も結果もありませんでした。
注:tsxはコンパイルされても、少なくともエラーでビルドに失敗しても、バンドルに入れられません。