TypeScript compile import's into a single file

Question

Inside my TypeScript application I use different import's for my own modules and node modules.

Every time i use "import" i want it to really import the module and compile it into a single js-file. Currently it looks like this:

main.ts:

import * as $ from "jquery";
$('body').css({'color': 'red'});

main.js (output)

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var $ = require("jquery");
$('body').css({ 'color': 'red' });

But what i want is that instead of var $ = require("jquery"); it really imports jQuery into this file (but only if it wasn't imported earlier).

Did you mean import "jquery" which will import jquery to the global scope? What do you mean by "import into this file"? it's a bit ambiguous. — Omri Luzon
I doubt if it's possible via typescript, because it's not really an import, it sounds more like a concatenation of both files. And I think it's going to make debugging harder — Omri Luzon
Im pretty sure webpack or browserify is what i need. I wonder if this isn't part of the TypeScript compiler already? — Mick

basarat basarat · Accepted Answer · 2017-06-06T01:38:41

TypeScript compile import's into a single file

You need a module bundler. e.g. Webpack or browserify.

More