NextJS '/' 到 index.js 什么都不加载答案

【问题标题】：NextJS '/' to index.js loads nothingNextJS '/' 到 index.js 什么都不加载
【发布时间】：2018-10-09 10:16:22
【问题描述】：

我是 Next.js 的新手，我遇到了一个问题，即 http://localhost:3000 在使用客户端路由时不起作用，但在我使用刷新时会加载。

显示导航的我的Header.js 文件

import Link from 'next/link'
const Header = () => (
    <div>
        <Link href='/'>
          <a style={linkStyle}>Home</a>
        </Link>

        <Link href='/about'>
          <a style={linkStyle}>About</a>
        </Link>

        <Link href='/listing'>
            <a style={linkStyle}>Search</a>
        </Link>

    </div>
)

export default Header

然后在 server.js 上，我几乎拥有 Next.js 的默认代码

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

const dev = process.env.NODE_ENV !== 'production'
const app = next({ dev })
const handle = app.getRequestHandler()

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

  server.get('/listing/:id', (req,res) => {
    const actualPage = '/listing'
    const queryParams = {
      id: req.params.id
    }
    app.render(req, res, actualPage, queryParams)

  })

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

  server.listen(3000, (err) => {
    if (err)
      throw err
    console.log('> Ready on http://localhost:3000')
  })
}).catch((ex) => {
  console.error(ex.stack)
  process.exit(1)
})

我的/about 和/listing 页面有效，如果我使用/nonexistance-url 它将return 404。但是，我无法在客户端链接到 /

【问题讨论】：

标签： node.js reactjs express next.js

【解决方案1】：

显然这是 next-css 的错误

const withCSS = require('@zeit/next-css')
module.exports = withCSS({/* my next config */})

这 2 个线程正在讨论这个问题，显然很难修复，以防有人遇到同样的错误。

https://github.com/zeit/next.js/issues/5291

https://spectrum.chat/thread/2183fc55-236d-42cb-92b9-3ab10acc6303

上述帖子建议的临时解决方案对我有用。

创建一个空的 css 文件并将其导入到您的 _app.js 中

【讨论】：