将 Express 路由器与 Next.js 一起使用

Question

我正在尝试将 Express Router 与 Next.js 一起使用，并使用他们的 custom-express-server example 作为我的样板。唯一的区别是我试图在 routes/router.js 上定义外部路由，如下所示：

server.js 中的代码：

const express = require('express')
const next = require('next')

const port = parseInt(process.env.PORT, 10) || 3000
const dev = process.env.NODE_ENV !== 'production'
const app = next({ dev })
const handle = app.getRequestHandler()
const routes = require('./routes/router')

app.prepare()
  .then(() => {
    const server = express()

    server.use('/', routes)

    server.get('*', (req, res) => {
      return handle(req, res)
    })

    server.listen(port, (err) => {
      if (err) throw err
      console.log(`> Ready on http://localhost:${port}`)
    })
  })

module.exports = app;

router/router.js 中的代码：

const express = require('express'),
app = require('../server.js'),
router = express.Router();

router.get('/a', (req, res) => {
  return app.render(req, res, '/b', req.query)
})

router.get('/b', (req, res) => {
  return app.render(req, res, '/a', req.query)
})

router.get('/posts/:id', (req, res) => {
  return app.render(req, res, '/posts', { id: req.params.id })
})

module.exports = router;

此时，即使我从 server.js 导入“app”，app 在 router.js 中也不可用。

我的逻辑不正确吗？ 如果不是，那为什么 app 在 router.js 中不可用？

Answer 1

刚刚解决了。这个问题被称为循环依赖，应该不惜一切代价避免它......除非你正在使用的模式（比如我使用的样板，我猜......）需要它。

要解决它，只需从文件“A”中导出文件“B”使用的依赖项，然后在文件“A”上需要文件“B”。

...差不多就是这样。

Answer 2

您也可以尝试使用 next-routes，我在所有 Next 项目中都使用它：

// server.js
const { createServer } = require('http');
const next = require('next');
const routes = require('./routes');

const port = parseInt(process.env.PORT, 10) || 3000;
const dev = process.env.NODE_ENV !== 'production';
const app = next({ dev });
const handler = routes.getRequestHandler(app);

app.prepare().then(() => {
    createServer(handler).listen(port, err => {
        if (err) {
            throw err;
        }
        console.log(`> Ready on http://localhost:${port}`);
    });
});

然后您可以在routes.js 文件中配置您的路由，而无需访问应用程序：

// routes.js

const nextRoutes = require('next-routes');
const routes = (module.exports = nextRoutes());

routes
    .add('landing', '/')
    .add('blog', '/blog', 'blog')
    .add('blog-post', '/blog/:postId', 'blog')