TypeScript issues with v0.29.1 (tested in sveltjs/sapper-template)

[letmejustputthishere]

I'm still experiencing this. Steps to reproduce:

npx degit "sveltejs/sapper-template#rollup" my-app
cd my-app
node scripts/setupTypeScript.js
npm install
npm run dev

Leads to:

• service worker
@rollup/plugin-typescript TS2769: No overload matches this call.
  Overload 1 of 2, '(pattern: string | RegExp, ...handlers: (Polka<Request> | Middleware<Request>)[]): Polka<Request>', gave the following error.
    Argument of type 'RequestHandler<ParamsDictionary, any, any, ParsedQs, Record<string, any>>' is not assignable to parameter of type 'string | RegExp'.
      Type 'RequestHandler<ParamsDictionary, any, any, ParsedQs, Record<string, any>>' is missing the following properties from type 'RegExp': exec, test, source, global, and 12 more.
  Overload 2 of 2, '(...handlers: (Polka<Request> | Middleware<Request>)[]): Polka<Request>', gave the following error.
    Argument of type 'RequestHandler<ParamsDictionary, any, any, ParsedQs, Record<string, any>>' is not assignable to parameter of type 'Polka<Request> | Middleware<Request>'.
      Type 'RequestHandler<ParamsDictionary, any, any, ParsedQs, Record<string, any>>' is not assignable to type 'Middleware<Request>'.
        Types of parameters 'req' and 'req' are incompatible.
          Type 'Request' is missing the following properties from type 'Request<ParamsDictionary, any, any, ParsedQs, Record<string, any>>': get, header, accepts, acceptsCharsets, and 21 more.

11   compression({ threshold: 0 }),
     ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

@rollup/plugin-typescript TS2769: No overload matches this call.
  The last overload gave the following error.
    Argument of type '(err: any) => void' is not assignable to parameter of type 'ListenCallback'.

15  .listen(PORT, err => {
                  ~~~~~~~~

  node_modules/polka/index.d.ts:61:2
    61  listen(handle: any, callback?: ListenCallback): this;
        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    The last overload is declared here.

Originally posted by @letmejustputthishere in https://github.com/sveltejs/sapper/issues/1706#issuecomment-863952613

After updating to v0.29.1, the issue still persists.

[ilikepi63]

Hey dude,

What worked for me is to rather use express - what seemed to be the problem was the type declarations that the polka library is using. So:

npm install express npm install --save-dev @types/express

then change your server.js file to look something like this:

import sirv from "sirv";
import polka from "polka";
import compression from "compression";
import * as sapper from "@sapper/server";
import express from "express";

const { PORT, NODE_ENV } = process.env;
const dev = NODE_ENV === "development";

express()
    .use(
        compression({ threshold: 0 }),
        sirv("static", { dev }),
        sapper.middleware()
    )
    .listen(PORT, () => {
    });

and then to fix the interop problem I was getting, add "esModuleInterop": true to your tsconfig file:

{
    "extends": "@tsconfig/svelte/tsconfig.json",
    "compilerOptions": {
        "lib": [
            "DOM",
            "ES2017",
            "WebWorker"
        ]
    },
    "include": [
        "src/**/*",
        "src/node_modules/**/*"
    ],
    "exclude": [
        "node_modules/*",
        "__sapper__/*",
        "static/*"
    ],
    "esModuleInterop": true
}

Hope this helps!

[craigmdennis]

Can confirm https://github.com/sveltejs/sapper/issues/1783#issuecomment-869221926 resolves the error. Though I have no idea what the implications of this change are.

[ilikepi63]

There aren't implications - Express and Polka are interchangeable in this regard.

The issue was being caused with the typing of Polka middleware, which is what the compression() function is. It is typed as a RequestHandler and not whatever Polka types their middleware as. So a quick workaround is just to swop out polka with express, which is what we did :)

https://www.npmjs.com/package/polka

[letmejustputthishere]

Thank you very much @ilikepi63 , that did the trick :)