I am interested in developing a JavaScript Library using RxJs (5.0.0-Beta.6) and TypeScript (1.8.10).
My TypeScript file is successfully compiling. Below are the files I have:
MyLib.ts:
/// <reference path="../../typings/globals/es6-shim/index.d.ts" />
import * as Rx from 'rxjs/Rx';
Rx.Observable.of('foo', 'bar');
tsconfig.json:
{
"compilerOptions": {
"module": "commonjs"
,"target": "es5"
,"sourceMap": true
},
"files": [
"src/MyLib.ts"
]
}
I use gulp-typescript to generate the JS file, which results in:
MyLib.js:
"use strict";
var Rx=require("rxjs/Rx");
Rx.Observable.of("foo","bar");
To incorporate this file into an HTML document, I need to include its dependencies:
RxJs 5.0.0 Beta 6 >> node_modules/rxjs/bundles/Rx.min.js
SystemJS 0.19.38 >> node_modules/systemjs/dist/system.js
RequireJS 2.3.2 >> node_modules/requirejs/require.js
This is my HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8>
<title>MyLib Test</title>
<script src="vendor/require.js"></script>
<script src="vendor/system.js"></script>
<script src="vendor/Rx.min.js"></script>
<script src="MyLib.js"></script>
</head>
<body>
</body>
</html>Issue Faced:
Upon checking the Chrome Console, I encountered the following error:
Uncaught Error: Module name "rxjs/Rx" has not been loaded yet for context: _. Use require([])
I am unable to load the simple JavaScript file MyLib.js created with RxJs and TypeScript. How can I resolve this problem?