How to use only a part of rxjs-compat, or write a custom rxjs-compat?

Question

We've updated our project to use Angular & Rxjs 6 and all works fine.

We've also updated the code to use the pipe operators, so we would like to drop rxjs-compat.
The only issue is that one of our dependencies still uses the old import syntax for Observable and Subject.

import { Observable } from 'rxjs/Observable';
import { Subject } from 'rxjs/Subject';

Is there any way to provide our own minimal rxjs-compat just for these two classes?

The library does not do anything fancy with Observable and Subject, and doesn't use any operators, so it seems overkill to import the full rxjs-compat package.

Answer 1

I don't think you need to copy any files when using the paths option.

I'd try something like this:

"compilerOptions": {
    "baseUrl": ".",
    "paths": {
        "rxjs/Observable": ["./node_modules/rxjs/internal/Observable"],
        "rxjs/Subject": ["./node_modules/rxjs/internal/Subject"]
    }
}

Note that baseUrl must be specified.

The question is whether or not the paths option affects other dependencies in node_modules. I'm not sure and I didn't try it.

Answer 2

Using paths as metioned by @cartant I managed to get it to compile without rxjs-compat, but the output main.js is even larger than using the full compat library...

• With rxjs-compat = 691 KB
• With patched library import = 671 KB (ideal size)
• with rxjs-compat paths hack = 700 KB

I've probably done something wrong, but I don't have time to investigate this further.

Steps for the hack:

1. Create a folder src\rxjs-compat\node_modules (note the node_modules name, it's used to bypass a webpack bug)
2. Copy the d.ts and .js files you need from rxjs-compat (in my case Observable and Subject)
3. Edit tsconfig.app.json and add the following paths in the compilerOptions: "paths": { "rxjs-compat/Observable": [ "rxjs-compat/node_modules/Observable"], "rxjs/Subject": [ "rxjs-compat/node_modules/Subject"] }