ami
ami copied to clipboard
FNNDSC
Add Typescript support
The objective of this PR is to help our migration process to TS. We will be able to use both TS and JS then just get rid of JS when all the code has been ported to TS.
- Support TS and JS file (for smooth transition to type script)
- Generate JS bundles as before
- Generate definition files
- Add a .tslint configuration file for editors to nicely pick up changes
- Transpile every file to TS ?
Hey! I can try helping out with this! I don't have any experience with TS but I'm a quick learner. How did you envision the changeover? Update all/most JS files to TS or do them one at a time?
I think that's too much work, but at least a couple of files and the bundles properly generated would be great, so we can continue the transition after the Hackoberfest :)
I'm happy to split issue in multiple sub-issues if you think it makes sense so more people can work on it!
Yea I think that would be awesome! You could maybe split it into file-by-file if that works?
I think the first step is to update the webpack scripts then update one file at the time!
Awesome! I can help with either or! About to go to class so I'll be busy for the next hour but afterwards I can start making the changeover!
That being said if someone else wants to tackle the webpack scripts then by all means go ahead!
@SerekKiri do you have experience with TS? If so I'd suggest you look into it if you are interested and after we can work on file by file conversion to TS.
Thoughts?
@ShawnToubeau @SerekKiri so I'd suggest @SerekKiri improves the webpack configuration to also support TS / generate definitions then we can all work on file migration.
For me the challenge seems to be able to support both JS and TS in the same project!
Ok, i can work only in the evening 👍 I'll be at 19-20 so if @ShawnToubeau have time now he can try 😄 or when i come back to home.
@SerekKiri @NicolasRannou @ShawnToubeau : I have experience migrating from JavaScript to TypeScript in webpack at my day-job. I'm happy to help here.
Can I suggest that the webpack configuration get split up into multiple files depending on the environment? (aka dev vs production?)
You can do this by creating a file like webpack.common.js and having everything each build shares in there, and then having a webpack.dev.js and webpack.production.js files that import that and extend the configuration. Then you can target the file you want based on the environment/script you are running.
This helps in a number of ways:
- much easier to maintain
- it's far more clear what is specific to a given build target.
- It will make implementing this issue easier if it is taken care of first.
The webpack docs give an example of this in its production tutorial.
@AlexSwensen that's a great idea! Will read over the docs for that right now. @NicolasRannou is it difficult to integrate JS and TS into one project? Does it explicitly want one or the other?
@AlexSwensen thanks for suggestions 😃. I was only working with ts, this is my first migration 😄 If you can and you want i will be very heppy when you will show us. 👍
@SerekKiri @ShawnToubeau sure thing, I'll take a stab at this tonight once I'm off work.
In the mean time, i think i can simplify what I understand for the group.
TypeScript transpiles to JavaScript, and is an extension of the ES6/ESNext standard, so having javascript and typescript side-by-side in the same project is a natural progression.
From what I see in the current Webpack configuration, the rules for handling .js files are already taken care of. It should be a relatively simple matter of getting webpack to understand which loader to use for .ts files. (i would recommend starting with ts-loader, given it aligns with the official webpack docs.)
From that point, the migration from .js to .ts is iterative and can be done on a per-file basis as features are added and/or refactored.
I'll work on an example of this when i get home and put it up for review.
@AlexSwensen just saw your PR, looks good to me!
I have a question though when I run for example yarn example geometries_slice it defaults to 0.0.0.0:8080 instead of localhost:8080. Is this a bug?
'Models' and 'Parsers' should not be ported yet as there are some open PRs.
All the rest, included test should be.
Would be great if we can write more tests while porting the files :P
Sweet, I can start helping convert some of the files over. @NicolasRannou what do you guys use to test? Don't have much experience writing tests but always willing to learn!
@ShawnToubeau sorry for the late reply - we currently use karma with jasmine.
I think now I'd use karma with mocha + chai + sinon because it supports async testing better it seems.
Anyway, I'd suggest to convert code from /core and write tests (even dummy one, just to have basic structure running), and move from there!
Thanks
No worries!! I can try converting some of the files later today/over the next few days. Will keep you updated! 😃
