Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Unable to import in TS project without TS DOM lib #6297

Closed
OliverJAsh opened this issue Apr 30, 2021 · 7 comments
Closed

Unable to import in TS project without TS DOM lib #6297

OliverJAsh opened this issue Apr 30, 2021 · 7 comments
Labels
TS Issues and PRs related purely to TypeScript issues

Comments

@OliverJAsh
Copy link
Contributor

OliverJAsh commented Apr 30, 2021

In 7.0.0-rc.3 and prior it was possible to import rxjs in a TS project that omitted the DOM lib. For example:

tsconfig.json:

{
    "compilerOptions": {
        "lib": ["ES2015"]
    }
}

However in 7.0.0 this is no longer possible because of this change: https://github.com/ReactiveX/rxjs/pull/6276/files#diff-a2a171449d862fe29692ce031981047d7ab755ae7f84c707aef80701b3ea0c80R9-R13

index.ts:

import * as RxJS from 'rxjs'
RxJS;

When I run tsc --noEmit I get a bunch of errors:

$ tsc --noEmit
node_modules/rxjs/dist/types/internal/ajax/AjaxResponse.d.ts:20:29 - error TS2304: Cannot find name 'ProgressEvent'.

20     readonly originalEvent: ProgressEvent;
                               ~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/ajax/AjaxResponse.d.ts:26:19 - error TS2304: Cannot find name 'XMLHttpRequest'.

26     readonly xhr: XMLHttpRequest;
                     ~~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/ajax/AjaxResponse.d.ts:56:28 - error TS2304: Cannot find name 'XMLHttpRequestResponseType'.

56     readonly responseType: XMLHttpRequestResponseType;
                              ~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/ajax/AjaxResponse.d.ts:89:20 - error TS2304: Cannot find name 'ProgressEvent'.

89     originalEvent: ProgressEvent,
                      ~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/ajax/AjaxResponse.d.ts:95:10 - error TS2304: Cannot find name 'XMLHttpRequest'.

95     xhr: XMLHttpRequest,
            ~~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/ajax/errors.d.ts:13:10 - error TS2304: Cannot find name 'XMLHttpRequest'.

13     xhr: XMLHttpRequest;
            ~~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/ajax/errors.d.ts:26:19 - error TS2304: Cannot find name 'XMLHttpRequestResponseType'.

26     responseType: XMLHttpRequestResponseType;
                     ~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/ajax/errors.d.ts:37:32 - error TS2304: Cannot find name 'XMLHttpRequest'.

37     new (message: string, xhr: XMLHttpRequest, request: AjaxRequest): AjaxError;
                                  ~~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/ajax/errors.d.ts:56:15 - error TS2304: Cannot find name 'XMLHttpRequest'.

56     new (xhr: XMLHttpRequest, request: AjaxRequest): AjaxTimeoutError;
                 ~~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/ajax/types.d.ts:62:19 - error TS2304: Cannot find name 'XMLHttpRequestResponseType'.

62     responseType: XMLHttpRequestResponseType;
                     ~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/ajax/types.d.ts:138:20 - error TS2304: Cannot find name 'XMLHttpRequestResponseType'.

138     responseType?: XMLHttpRequestResponseType;
                       ~~~~~~~~~~~~~~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/ajax/types.d.ts:150:23 - error TS2304: Cannot find name 'XMLHttpRequest'.

150     createXHR?: () => XMLHttpRequest;
                          ~~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/ajax/types.d.ts:162:42 - error TS2304: Cannot find name 'ProgressEvent'.

162     progressSubscriber?: PartialObserver<ProgressEvent>;
                                             ~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/ajax/types.d.ts:190:28 - error TS2304: Cannot find name 'URLSearchParams'.

190     queryParams?: string | URLSearchParams | Record<string, string | number | boolean | string[] | number[] | boolean[]> | [string, string | number | boolean | string[] | number[] | boolean[]][];
                               ~~~~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/observable/dom/fetch.d.ts:3:54 - error TS2304: Cannot find name 'Request'.

3 export declare function fromFetch<T>(input: string | Request, init: RequestInit & {
                                                       ~~~~~~~

node_modules/rxjs/dist/types/internal/observable/dom/fetch.d.ts:3:69 - error TS2304: Cannot find name 'RequestInit'.

3 export declare function fromFetch<T>(input: string | Request, init: RequestInit & {
                                                                      ~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/observable/dom/fetch.d.ts:4:26 - error TS2304: Cannot find name 'Response'.

4     selector: (response: Response) => ObservableInput<T>;
                           ~~~~~~~~

node_modules/rxjs/dist/types/internal/observable/dom/fetch.d.ts:6:51 - error TS2304: Cannot find name 'Request'.

6 export declare function fromFetch(input: string | Request, init?: RequestInit): Observable<Response>;
                                                    ~~~~~~~

node_modules/rxjs/dist/types/internal/observable/dom/fetch.d.ts:6:67 - error TS2304: Cannot find name 'RequestInit'.

6 export declare function fromFetch(input: string | Request, init?: RequestInit): Observable<Response>;
                                                                    ~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/observable/dom/fetch.d.ts:6:92 - error TS2304: Cannot find name 'Response'.

6 export declare function fromFetch(input: string | Request, init?: RequestInit): Observable<Response>;
                                                                                             ~~~~~~~~

node_modules/rxjs/dist/types/internal/observable/dom/WebSocketSubject.d.ts:103:26 - error TS2304: Cannot find name 'MessageEvent'.

103     resultSelector?: (e: MessageEvent) => T;
                             ~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/observable/dom/WebSocketSubject.d.ts:113:24 - error TS2304: Cannot find name 'MessageEvent'.

113     deserializer?: (e: MessageEvent) => T;
                           ~~~~~~~~~~~~

node_modules/rxjs/dist/types/internal/observable/dom/WebSocketSubject.d.ts:117:33 - error TS2304: Cannot find name 'Event'.

117     openObserver?: NextObserver<Event>;
                                    ~~~~~

node_modules/rxjs/dist/types/internal/observable/dom/WebSocketSubject.d.ts:121:34 - error TS2304: Cannot find name 'CloseEvent'.

121     closeObserver?: NextObserver<CloseEvent>;
                                     ~~~~~~~~~~

node_modules/rxjs/dist/types/internal/observable/dom/WebSocketSubject.d.ts:133:59 - error TS2304: Cannot find name 'WebSocket'.

133         new (url: string, protocols?: string | string[]): WebSocket;
                                                              ~~~~~~~~~

node_modules/rxjs/dist/types/internal/observable/dom/WebSocketSubject.d.ts:138:63 - error TS2304: Cannot find name 'Blob'.

138 export declare type WebSocketMessage = string | ArrayBuffer | Blob | ArrayBufferView;
                                                                  ~~~~


Found 26 errors.

Reduced test case: https://github.com/OliverJAsh/rxjs-v7-no-dom-lib-test

For context, we use RxJS in a Node project and TS is configured to omit the DOM lib (it's included by default) since we want to disallow references to things like window in a Node file.

@cartant
Copy link
Collaborator

cartant commented Apr 30, 2021

I expect it's this change: #6276

rxjs/src/index.ts

Lines 8 to 14 in f132d0d

// tslint:disable: no-reference
/// <reference path="./ajax/index.ts" />
/// <reference path="./fetch/index.ts" />
/// <reference path="./operators/index.ts" />
/// <reference path="./testing/index.ts" />
/// <reference path="./webSocket/index.ts" />
// tslint:enable: no-reference

IMO, we should just abandon trying to get auto imports to work in VS Code.

@cartant cartant added bug Confirmed bug TS Issues and PRs related purely to TypeScript issues and removed bug Confirmed bug labels Apr 30, 2021
@benlesh
Copy link
Member

benlesh commented Apr 30, 2021

Sigh. Shenanigans.

Well, I suppose we can revert that change, but it will cause endless pain for VS Code users.

@cartant
Copy link
Collaborator

cartant commented Apr 30, 2021

Well, I suppose we can revert that change, but it will cause endless pain for VS Code users.

How about I just add a fixer to the ESLint rules?

@cartant
Copy link
Collaborator

cartant commented Apr 30, 2021

Actually, why don't we just remove the references that are DOM-only?

 // tslint:disable: no-reference
 /// <reference path="./operators/index.ts" />
 /// <reference path="./testing/index.ts" />
 // tslint:enable: no-reference 

I can still add a fixer to the ESLint rule, but what's above will cover 99.9% of the imports.

@kirillgroshkov
Copy link

🙏 (meaning "yes, please", as we have the same issue)

seanwu1105 added a commit to seanwu1105/vscode-qt-for-python that referenced this issue May 3, 2021
@benlesh benlesh closed this as completed in b24818e May 4, 2021
@evelant
Copy link

evelant commented Jun 3, 2021

7.1.0 still seems to pull in DOM libs. I had to revert to 6.6.7 on React Native or I ended up with lots of duplicate identifier errors.

@OliverJAsh
Copy link
Contributor Author

Can we re-open this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
TS Issues and PRs related purely to TypeScript issues
Projects
None yet
Development

No branches or pull requests

5 participants