Angular 5 Webpack 4 Rxjs 5 DllPlugin - Duplicated RxJs everywhere

Question

I'm using :

"webpack": "4.12.0",    
"rxjs": "5.5.9",
"@angular" : "5.2.11"

and bundling libs with DDL Plugin.

{
    entry: 
    {"rxjs_5_5_9": [
      "rxjs
    ],
    "angular_5_2_11": [
      "@angular/common",
      "@angular/compiler",
      "@angular/core",
      "@angular/http",
      "@angular/platform-browser",
      "@angular/platform-browser-dynamic",
      "@angular/router",
      "@angular/service-worker",
      "zone.js"
    ], (...) , "pck_libs_5_x_x": [
      "pck-referentiel"
    ]},
    output: {
      filename: "[name].bundle.js",
      path: TARGET_PATH + "/vendors/",
      library: '[name]_lib'
    },
    plugins: [
      new webpack.DllPlugin({
        context: '.',
        name: '[name]_lib',
        path: TARGET_PATH + "/vendor-[name]-manifest.json",
      }),
    ]
  };

I have, as you can see above, declared Rxjs as a separated bundle. My custom library, pck-referentiel , uses rxjs and imports it 99% of the time with :

import {Observable} from "rxjs/Rx";

And here is the result :

(I circled every duplicated rxjs)

We can clearly see that rxjs is scattered amongst all various third-party libs, including mine.

What is the correct way to reference RxJs with DllPlugin so as it is not duplicated in every module that import it ?

Answer 1

Those are from your third party dependent packages, which internally depend on rxjs and not the one which you have added as dependency package (rxjs). You can clearly see the duplicate rxjs boxed inside other third party packages.

So they will be imported duplicate (cannot say duplicate, because they might vary by sub modules within rxjs) inside the vendor bundle.