[BUG] [3.1.2] Duplicated rxjs

[KatSick]

Bug Report Quick Checklist

• [x] I am on the latest version of Snowpack & all plugins.
• [x] I use package manager yarn (Fill in: npm, yarn, pnpm, etc).
• [x] I run Snowpack on OS macOS BigSur 11.2.3 (Fill in: Windows, Mac, Linux, etc).
• [x] I run Snowpack on Node.js v12+

Describe the bug

Duplicated rxjs package is included (rxjs and rxjs.operators) which broke packages that relies on instanceof Observable checks.

To Reproduce

1. npx create-snowpack-app rxjs-duplicate-repro --template @snowpack/app-template-react --use-yarn
2. yarn add @grammarly/focal rxjs
3. Open App.jsx
4. add

   
   import { Atom } from '@grammarly/focal'
   import { Observable } from 'rxjs'

// just for usage Atom.create(null) Observable.create()

5. Run `yarn start`
6. See devtools 

### Expected behavior

There should be only 1 rxjs in final bundle (it works fine on 3.0.11 version of snowpack)

[FredKSchott]

Code should be successfully split and then shared between the two files, so there's not actually duplicate code in your project (unless you're seeing differently). But, I'm not sure why this isn't working though for your instanceof check. Will still need someone to reproduce locally.

[KatSick]

Hi @FredKSchott

rxjs and rxjs.operators contains identical code, like Observable, Subject, etc. This is the root issue.

Since one library can create Observable from "rxjs" and another from "rxjs.operators", instanceof check will not work, since this is two separate Observable implementations.

Does this makes sense for you? I can provide debugger screenshots if you need or example code, which will fail on instanceof check.

Thanks in advance

[KatSick]

Hi @FredKSchott,

If you need a minimal example of "instanceof check failure," please, try to run it on 3.0.11 (works fine, no errors) and on 3.2.2 (Uncaught Error: Objects are not valid as a React child).

import { F } from '@grammarly/focal';
import React from 'react';
import { of } from 'rxjs';
import { startWith } from 'rxjs/operators';
import './App.css';

function App() {
  return (
    <p>
      Page has been open for <F.code>{of(0).pipe(startWith(1))}</F.code> seconds.
    </p>
  );
}

export default App;