NextJs自定义Express服务器工作不正常

NextJs自定义Express服务器工作不正常,express,next.js,Express,Next.js,我最近决定迁移到NextJs,但在迁移过程中遇到了一些问题。我已经编写了一个ExpressJSAPI,现在我想用它作为一个定制的NextJs服务器,正如文档中所说,但我无法让它工作 这是我的server.ts文件(我使用的是Typescript) /// 从“快递”导入快递; 从“下一步”导入下一步; //其余的导入(我删除了它以缩短代码) 从“/api”导入api; const dev=process.env.NODE_env!==“生产”; const app=next({dev}); co

我最近决定迁移到NextJs,但在迁移过程中遇到了一些问题。我已经编写了一个ExpressJSAPI,现在我想用它作为一个定制的NextJs服务器,正如文档中所说,但我无法让它工作

这是我的server.ts文件(我使用的是Typescript)

///
从“快递”导入快递;
从“下一步”导入下一步;
//其余的导入(我删除了它以缩短代码)
从“/api”导入api;
const dev=process.env.NODE_env!==“生产”;
const app=next({dev});
const handle=app.getRequestHandler();
const port=process.env.port | 3000;
require(“dotenv”).config();
应用程序
.准备
.然后(()=>{
const server=express();
//以下所有中间产品都是以前进口的
使用(记录器(“开发”));
使用(cors());
使用(compression());
use(express.json());
use(express.urlencoded({extended:false}));
使用(cookieParser());
server.use(NoCache);
server.use(“/api”,auth.userHeader(),api);//我的路由
get(“*”,(req,res,next)=>handle(req,res));//NextJs handle
server.use(ErrorHandler);
服务器。侦听(端口,()=>{
log(`Server listing to port${port}`);
});
})
.catch((ex)=>{
控制台错误(例如堆栈);
过程。退出(1);
});
导出默认应用程序;

我制作了一个非常简单的应用程序来测试它(只有一个登录页面的链接)

当我使用
next
运行项目时,我的应用程序[按预期工作,并应用了样式][2],但显然ExpressJSAPI没有。但是,当我运行
server.ts
文件时,API按预期工作(所有端点都正常工作),我成功地编译了next的
消息,但是[页面为空][3]给出了next自动应用的
样式,并且没有CSS加载到应用程序中(我在
globals.scss
上的
body
标记中添加了一个样式,将其显示设置为
block!important
,这样它将覆盖使页面无法显示的样式)

这是我的app.tsx文件

从“./context/auth”导入{AuthProvider};
导入“./style/globals.scss”;
函数MyApp({Component,pageProps}){
返回(
);
}
导出默认MyApp;
您可以看到我在顶部导入了
globals.scss

这是我的_document.tsx文件

从“next/Document”导入文档,{Html,Head,Main,NextScript};
类NextDocument扩展文档{
render(){
返回(
);
}
}
导出默认的下一个文档;
下面是我的下一个.config.js文件

module.exports={
publicRuntimeConfig:{
//将在服务器和客户端上都可用
API_URL:process.env.API_URL,
},
};
我有什么遗漏吗?我看了文档和一些视频,但仍然没有进展

提前谢谢。如果您需要任何其他信息,请告诉我

更新 经过几次测试后,我意识到当我删除typescript时,一切都很完美。我仍然不知道如何解决它,我不想失去typescript的所有好处

我的tsconfig.json

{
“编译器选项”:{
“目标”:“es5”,
“lib”:[“dom”、“dom.iterable”、“esnext”],
“allowJs”:正确,
“skipLibCheck”:正确,
“严”:假,
“ForceConsistentCasingFileNames”:true,
“noEmit”:没错,
“esModuleInterop”:正确,
“模块”:“CommonJS”,
“moduleResolution”:“节点”,
“resolveJsonModule”:true,
“隔离模块”:正确,
“jsx”:“保留”
},
“包括”:[“下一个环境d.ts”、“***.ts”、“***.tsx”、“pages/a.js”、“pages/b.js”、“pages/index.js”、“server.js”],
“排除”:[“节点_模块”]
}

经过更多的测试并意识到typescript是问题所在,我将
tsconfig.json
上的目标从
ES5
更改为
ES6
,现在一切正常