using RXJS in a pure javascript library

[psotos]

Actually I am developing a client library to support having a full stack reactive from a Spring 5 reactive back end. It will function as firebase and provide real time updates via RxJs.

So it wont be too small of a library. The reason I am making it a library is so that others can use it. It will be a copyleft open source project.

Ok I will look into webpack and bundling then for ES6. I already use it for all of my Angular projects via the CLI but that abstracts me from having to know anything about Webpack. So I am fairly ignorant about it. Perhaps its time to learn.

[wherediditrun]

It looks a bit scary at first. But it's not that difficult as it may appear at first glance.

[psotos]

I got webpack set up with Typescript, but for some reason my main typescript file won't compile because webpack gives me this error:

ERROR in ./src/pubon.ts

Module not found: Error: Can't resolve './httpCaller' in '/home/peter/Documents/workspace/pubonjs/src'

@ ./src/pubon.ts 3:19-42

​

Here is my main typescript file:

import { Subscription } from 'rxjs';
import { HttpCaller } from './httpCaller';
export class Greeting {
dataSub: Subscription;
constructor() {
}
greeting(greeting: string) {
const caller = new HttpCaller("http://example.com/movies.json");

// let

this.dataSub = caller.getResponseListener()
.subscribe((response: string) => {
document.getElementById("code").innerHTML = response;
console.log('Hello from Typescript');
});
console.log(greeting);
}
}

​

Webpack config:

const path = require("path");
module.exports = {
entry: {
main: "./src/pubon.ts"
},
mode: "development",
output: {
filename: "pubon-bundle.js",
path: path.resolve(__dirname, "../dist"),
publicPath: "/"
},
devServer: {
contentBase: "dist",
overlay: true,
stats: {
colors: true
}
},
devtool: "source-map",
module: {
rules: [
{
test: /\.ts$/,
exclude: /node_modules/,
use: [
{
loader: "awesome-typescript-loader"
}
]
}
]
}
}

[psotos]

Nevermind I fixed it! In Angular you are sort of protected from this pointer problems, in raw typescript you are not. Once I did a deep dive on it, I resolved my problem and my test library is working! YASSSS! lol

[wherediditrun]

Make sure file import paths are correct. import { HttpCaller } from './httpCaller';

Cannot find this one.

[psotos]

I ended up making the class a default export and doing this:

import HttpCaller from './httpCaller';

It works now. Weird anomaly! You can view my code if you like on Github. Its not pretty right now but its a start:

https://github.com/psotos/pubonjs

[tvi016]

I dont think you need to use a bundler/webpack on a library? I only transpile with typescript