TypeScript requirejs issue with loading external modules

javascript, requirejs, typescript

Solution

I'm not sure where the idea of hand-editing the JavaScript files has come from. If you compile your TypeScript with the `--module amd` flag, you shouldn't need to edit the JavaScript files as the `import` statements will be converted into `require` statements.

The only script tag you should need on your page is this:

<script src="javascripts/require.js" data-main="ts/game.js"></script>

Once require.js has loaded, it will then load game.js, and whenever it comes across a `require` statement (which is your `import` statement in your TypeScript file) it will then load that script and then execute the code.

You can load in jQuery and GameObjects and any other modules just by adding `import` statements in your TypeScript file.

Problem

I am having issues with this game.js code that the game.ts file compiles to: ``` var GameObjects = require("./GameObjects") ``` I have set up my page index.html js imports as so: ``` <script language="javascript" src="javascripts/require.js" type="text/javascript"> </script> <script language="javascript" src="javascripts/jquery-1.8.2.min.js" type="text/javascript"> </script> <script language="javascript" src="ts/GameObjects.js" type="text/javascript"> </script> <script language="javascript" src="ts/game.js" type="text/javascript"> </script> ``` and this is the error in chrome: ``` Uncaught ReferenceError: exports is not defined GameObjects.js:82 Uncaught Error: Module name "GameObjects" has not been loaded yet for context: _. Use require([]) http://requirejs.org/docs/errors.html#notloaded ``` any ideas friends?

Original source