Typescript workflow in 2016

I am a complete newbie in web development. I wanted to try to develop a simple client project in Typescript (in this case, this is a game, but this question applies to other projects as well). No server technology, just something that works in the browser.

I downloaded Webstorm and was able to create a simple Typescript project and work in minutes.

However, when I tried to create some structure and a reasonable workflow for a larger project, I began to come across what seems like an insane amount of tools, managers, building systems, each in different depreciation states.

I tried simple and reliable:

  • Use multiple files without manually including script tags
  • Use external type definitions and javascript libraries and load them in a smart way

For my own code, it seems that es6 modules are the best bet, but for some reason it seems to me that I still need to use a third-party module loader? It seems that there is a huge variety of them - commonjs, requirejs, systemjs, webpack. In addition, although many sources recommend using es6, it is still not fully supported in most browsers, which means that I need to translate the translation as well. Also, somewhere along the lines there is a build process using gulp / grunt, which I don’t even know if I need to use!

I am not sure what to do for external modules. I tried Bower, but it still seems that I need to include tags manually for all my external libraries (not a huge problem, but I'm sure there is a better way!)

, - , -. , .

- front end - Typescript ( Javascript) ?

+4
3

:

  • script
  • javascript .

: Webpack.

: bundlers Webpack, Browserify, Rollup. JS-. SystemJS ( ) JSPM , RequireJS.

, ES6 import/export TypeScript TypeScript. TS module.

, , - , -?

.

Mozilla:

import ?

... ? [...]

ES6 .

API. . :

API

JavaScript Loader Standard, API- .

.

TypeScript import/export .

...

, es6, - , , .

- . API, , es6-shim .

+3

, tsconfig.json , .

SystemJS ( jspm bundling), , .

, .

Angular2 typescript SystemJS. , script ( , Webpack Browserify , ).

UMD , CommonJS AMD, . CommonJS AMD. .

0

Zwitterion. , . , - . TypeScript , ES-, / TypeScript. JS, , , . , TypeScript, , . , , CDN. .

0

All Articles