TypeError: node_1.Headers is not a constructor

[jseparovic]

Hi,

I'm seeing the following error when trying the quick start on remix v2:

TypeError: node_1.Headers is not a constructor
    at new EventStream (/example-ui/node_modules/src/server/EventStream.ts:31:21)
    at loader4 (/example-ui/app/routes/emitter.tsx:6:12)
    at Object.callRouteLoaderRR ((/example-ui/node_modules/@remix-run/server-runtime/dist/data.js:52:22)
    at handler ((/example-ui/node_modules/@remix-run/server-runtime/dist/routes.js:54:20)
    at runHandler ((/example-ui/node_modules/@remix-run/router/router.ts:3782:7)
    at callLoaderOrAction ((/example-ui/node_modules/@remix-run/router/router.ts:3842:22)
    at map (/(/example-ui/node_modules/@remix-run/router/router.ts:3155:9)
    at Array.map (<anonymous>)
    at loadRouteData ((/example-ui/node_modules/@remix-run/router/router.ts:3154:24)
    at queryImpl ((/example-ui/node_modules/@remix-run/router/router.ts:2932:26)

import { EventStream } from 'remix-sse'
import {LoaderFunction} from "@remix-run/router";
export const loader: LoaderFunction = ({ request }) => {

    // Return the EventStream from your route loader
    return new EventStream(request, (send) => {
        // In the init function, setup your SSE Event source
        // This can be any asynchronous data source, that will send
        // events to the client periodically

        // Here we will just use a `setInterval`

        const interval = setInterval(() => {
            // You can send events to the client via the `send` function
            send('greeting', JSON.stringify({ hello: 'world'}))
        }, 1000)

        return () => {
            // Return a cleanup function
            clearInterval(interval)
        };
    });
};

[dan-cooke]

@jseparovic sorry for the late reply, this lib has not been tested yet on RemixV2 - I am in the process of updating it

Issue for tracking : https://github.com/dan-cooke/remix-sse/issues/9

[dan-cooke]

@jseparovic sorry for the delay, everything is working for V2 now

[dan-cooke]

:tada: This issue has been resolved in version 4.0.0 :tada:

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot :package::rocket:

[jseparovic]

@dan-cooke Awesome! Thanks heaps for this. Perfect timing, I’m just getting back to UI dev today

[dan-cooke]

@jseparovic no problem! Let me know if the integration goes smoothly, I’m still ironing out some ES module issues but check the examples to see how to import in the meantime!

[jseparovic]

@dan-cooke Sounds good! Yeh I need to integrate with our existing inventory REST API. We have a Socket.IO server which is sending basic CRUD events for changes to inventory objects. This is my first remix project so still trying to figure out the events architecture and how to keep the UI updated as objects are updated in the API. I'm thinking the remix server will open a connection to the socket.io server and then use remix-sse to trigger the client UI to refresh as CRUD events come in.

[jseparovic]

@dan-cooke looks good now on 4.0.0 with remix v2.

Only issue I saw was the RemixSseProvider path changed from: import {RemixSseProvider} from "remix-sse/client"; to import {RemixSseProvider} from "remix-sse/dist/client";

[dan-cooke]

Great! That’s right about the paths - in v4 I changed the build structure slightly in an attempt to use workspaces with the example projects

There is an open PR #13 where I am investigating the issue

i will also open an issue to track this as it’s not ideal