Official Browserify plugin ?

[mhegazy]

From @matthiasg on July 17, 2015 12:16

Since any valid JS file is supposed to be a valid TS file too it should be possible to use a standard babelified webapp project and just switch it to use TS (e.g using tsify). Sadly that is not possible right now since there are some issues on requiring/importing dependencies and actually getting TS to emit anything (in a DI reliant project at least).

I think it would be helpful if the TS team would devote some time to setup official documentation similar or even extended to what the opensource babeljs team has done (https://babeljs.io/docs/setup/) with enough starters how to migrate their existing projects to TS. An official browserify plugin might also be helpful.

Specifically just exchanging babelify to tsify doesnt work right now even though both implement the ES6 features used (of course if one doesnt implement a specific feature proposed that wouldnt work).

Copied from original issue: Microsoft/TypeScript#3909

[mhegazy]

From @danquirk on July 17, 2015 18:20

Definitely hear you on the suggestions for more docs on migration strategies.

What would a browserify plugin actually do? Just run tsc for you with the settings from the local tsconfig? The babelify plugin seems convenient but not really unblocking anything unless I'm misunderstanding how it works. For example we use browserify ourselves to package up our test suite into something suitable for running the browser. We just run tsc as normal to generate some js and then package it with browserify as you normally would for any set of js files.

[mhegazy]

From @matthiasg on July 20, 2015 6:14

We would want a TS plugin to actually translate the files on the fly in the same fashion as babelify does it without generating intermediate files. With intermediary files there are always instances were devs accidentally edit the wrong file.

basically it should be possible to add typescriptify or whatever to the pipeline and allow for added .ts files anywhere. Those files should be able to simply import other files even when those are normal e.g commonjs javascript files (with module.export = ...) as well as be importable from other normal javascript files using require.

It should be possible to import another module with sideeffects without using the returned variable etc (i read this should be possible now did not get it running though yet in our project setup)

It should be possible to still use require for other purposes (e.g. css/html via cssify or stringify etc) (which i think wouldnt be a problem provided the declaration file is correct but that should be documented in the readme of such plugin)

[mhegazy]

@matthiasg, how about https://github.com/Microsoft/TypeScript/wiki/Integrating-with-Build-Tools#browserify? can you let us know what is missing, and how can we make it better?

[mhegazy]

From @matthiasg on August 20, 2015 8:31

i am on vacation now so i wont write a lot or re-check, but last time i tried using tsify etc they all failed on me. They work when i start from scratch but not when trying to partially start with ts inside a larger existing project. with babelify there was no issue at all. i just added it and was able to use es6/7 features everywhere i wanted with full compatibility to existing es5 code.

1) I couldnt just rename a file to .ts and re-build. it started complaining about missing declarations which goes against what anders promised (every valid js file is a valid ts file) 2) after declaring the globals (e.g in the config file i hear but we did it in the file itself) files with sideeffects (angular) didnt work (when used from another ts file they where compiled out) . i wanted to re-check using just import 'path' 3) importing without specifying the ts exension didnt work (or i was overtired, because sometimes i thought it did work) 4) importing a ts file from a non ts file didnt work 5) using async/await did not work (of course, not part of ts) but no clear understanding whether this will ever be possible and how to set that up (e.g parse it but expect another generator such as babelify to pick that up later)

[mhegazy]

@thanks @matthiasg for the input. looks like we need a sample here, at least to discover integration pains.

//CC @smrq from tsify.

[mhegazy]

From @remojansen on November 15, 2015 0:6

I would like to have an example of browserify + tsify + babelify with source maps :)

[mhegazy]

PRs to https://github.com/Microsoft/TypeScriptSamples are always welcomed

[mhegazy]

@DanielRosenwasser is working on a sample here.

[OliverJAsh]

It would be really neat if tsc just bundled node modules out of the box to do away with an extra layer of tooling.

[kitsonk]

I won't preach on how indiscriminately taking code that is written for server side and shoving it into a browser is a horribly bad idea, but instead restate TypeScript's non-goal:

4) Provide an end-to-end build pipeline. Instead, make the system extensible so that external tools can use the compiler for more complex build workflows.