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 #1706 (comment)

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 #1783 (comment) 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 :)