Jump to content

Better way to organize TypeScript scripts


Recommended Posts


I need your help to organize my files.

Currently I create many files (say, boot.js, preloader.js, scene1.js, scene2,js, and so on) in the same folder.

Then I concatenated them and generate a file named game.js that is finally minified to provide me a file named game.min.js.

This approach makes it a peace of cake to have just one minified file, but I'd like to organize them in folders similar to what I do in other programming languages.

I could put JavaScript files in folder and concatenate them as I'm doing now and it would work.

It doesn't work with TypeScript. For TypeScript files I have to use require command to read content from files (say, var s1 = require('./scene/scene1.js')).

So it makes harder to concatenate all files on a bigger one.

How do you handle this? 

Thank you.

Link to comment
Share on other sites

Use a proper module system to wrap up your code rather than just concatenation, which is brittle. I thought the TS build tools did this for you? In any case, https://www.typescriptlang.org/docs/handbook/react-&-webpack.html, is an example of using a bundler with TS.

There are better ways of course, but its a starting point for you.

Other tools you might want to check:

* Babel -> has TS plugins

* Buble -> Is also a language converter, not sure about TS support though

* Esprima -> Another transform runner, but, seriously, just use babel + TS plugin for now and have done with

* Browserify -> Bundles all your code up, easiest to use with Babel + plugins to do transforms

* Webpack -> Bundler

* Rollup -> Bundler

There are loads of good JS bundlers out there, but, in my opinion, I'd choose one of the above, probably browserify + babel, although webpack continues to make ground on it for some reason, I think its the fear of good cli tooling that scares people off.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...