Next.js模块使用typescript编译失败

Question

我正在和typescript一起做一个Next.js项目。我的开发服务器运行良好，当我进行编辑时，我能够看到前端的变化。我在修改了我的next.config.js文件后重新启动了我的开发服务器(我后来撤消了更改)。

当我重新启动服务器时，它无法编译，并且我在终端中收到以下错误:

如果我安装"@babel/preset-react"预设，我可以让它工作，但是我还需要在每个组件中设置import React from 'react';，这是我不想做的(在我重新启动服务器之前我也没有这样做)。

ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info  - Loaded env from /my/file/path/.env
info  - Disabled SWC as replacement for Babel because of custom Babel configuration ".babelrc" https://nextjs.org/docs/messages/swc-disabled
info  - Using external babel configuration from /my/file/path/.babelrc
error - ./src/pages/_app.tsx
Module parse failed: Unexpected token (5:9)
|   var Component = _ref.Component,
|       pageProps = _ref.pageProps;
>   return <Component {...pageProps} />;
| }
| _c = App;

我不知道为什么会这样，因为它之前是工作的。有人知道这个问题可能是什么吗?为什么它只在我重新启动服务器后才出现?

tsconfig.json(默认nextjs配置):

{
"compilerOptions": {
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"noEmit": true,
"esModuleInterop": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"jsx": "preserve",
"incremental": true,
"paths": {
"@/*": ["./src/*"]
}
},
"include": [
"next-env.d.ts",
"**/*.ts",
"**/*.tsx",
],
"exclude": ["node_modules"]
}

.babelrc:

{
"presets": ["@babel/preset-env", "@babel/preset-typescript"],
"plugins": [
"@babel/plugin-proposal-class-properties",
"@babel/plugin-proposal-object-rest-spread",
[
"module-resolver",
{
"alias": {
"@": "./src"
}
}
]
]
}

Answer 1

我遇到了同样的问题，如果你在终端中查看，nextjs显示了一个链接来解决这个问题:禁用SWC作为Babel的替代品，因为自定义Babel配置"https://nextjs.org/docs/messages/swc-disabled