类型“ NextHandleFunction”的参数不能分配给“ PathParams”类型的参数

Question

我已经安装了TypeScript并在基本的Express服务器上运行，但遇到了问题。

import bodyParser from 'body-parser';
import express, { Express } from 'express';

const app: Express = express();
app.use(bodyParser.json()); // Error 1
app.use(bodyParser.urlencoded({ extended: true })); // Error 2

错误1是这样的：

类型“ NextHandleFunction”中缺少属性“ pop”。[2345]

因此bodyParser.json()返回a createServer.NextHandleFunction但没有该pop属性。NextHandleFunction定义如下@types/connect：

export type NextHandleFunction = (req: http.IncomingMessage, res: http.ServerResponse, next: NextFunction) => void;

是的，不pop。但是，解决此问题我有什么选择？

错误2是这样的：

类型'NextHandleFunction'不能分配给类型'（string | RegExp）[]'。[2345]

在这里，bodyParser.urlencoded()还会返回一个createServer.NextHandleFunction，但这不是该类型app.use()正在寻找的。

同样，不确定我在这里的选择。

package.json

"dependencies": {
    "@types/body-parser": "^1.17.0",
    "@types/connect": "^3.4.32",
    "@types/express": "^4.16.0",
    "@types/express-serve-static-core": "^4.16.0",
    "body-parser": "^1.18.3",
    "express": "^4.15.2",
    "express-serve-static-core": "^0.1.1"
},
"devDependencies": {
    "typescript": "^3.1.6"
}

Answer 1

我能够通过这种方式修复错误：

import bodyParser from 'body-parser';
import express, { Express, RequestHandler } from 'express';

const app: Express = express();
app.use(bodyParser.json() as RequestHandler);
app.use(bodyParser.urlencoded({ extended: true }) as RequestHandler);

Answer 2

正如其他答案中所建议的那样，您不必强制转换中间件。我相信次要软件包版本之间可能存在一些不兼容性@types/*。删除一些类型包依赖项、删除node_modules/@types并显式安装@types/express、@types/express-serve-static-core和@types/cookie-parser（您可能不需要那个）后，我得到了（除其他外）

        "@types/cookie-parser": "^1.4.2",
        "@types/cors": "^2.8.10",
        "@types/express": "^4.17.12",
        "@types/express-serve-static-core": "^4.17.21",

我现在可以写了

import {json, urlencoded} from "express";

...

app.use(urlencoded({extended: false}));

...

app.post("./", json(), this.doPost.bind(this));

这些类型检查无需显式强制转换。我不确定旧包究竟出了什么问题，或者是否存在某种传递性 de-dupe 选择了错误的组合，但上面的版本似乎可以正常工作。

Answer 3

删除@types/express和@types/express-serve-static-core帮助我摆脱了这些错误，并且默认情况下类型也捆绑在express中。因此，请毫不犹豫地删除它们。此外，您不再需要 body-parser，因为 json 和 url 编码的中间件捆绑在 Express it-self 中。

Answer 4

在 app.ts 中添加如下导入语句。

import express, { RequestHandler } from 'express';

还要更改express.json()和express.urlencoded({extend: true})如下。

this.app.use(express.json() as RequestHandler);
this.app.use(express.urlencoded({ extended: true }) as RequestHandler);