Next.js无法路由页面

开发环境
next.js
打字稿
样式组件

我在构建next.js环境中所做的工作
纱线创建next-app
yarn add --dev打字稿@ types / react @ types / node
纱线添加样式组件 纱线添加-D @ types / styled-components

我跑了上面的四个

我不明白

执行上述命令并为next.js构建环境。

我在页面目录下创建了user.tsx并访问了页面/用户，但是出现404 Not Found错误。 为什么？

packege.json

{
  "name": "next-app",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    "next": "9.4.4",
    "react": "16.13.1",
    "react-dom": "16.13.1",
    "styled-components": "^5.1.1"
  },
  "devDependencies": {
    "@types/node": "^14.0.18",
    "@types/react": "^16.9.41",
    "@types/styled-components": "^5.1.0",
    "typescript": "^3.9.6"
  }
}

import React, { FC } from "react";
import styled from "styled-components";
import Sidebar from "../components/atoms/SideBar";
import UserList from "../components/atoms/UserList";

const UsersStyle = styled.div`
  display: flex;
  height: 100vh;
`;

export const User: FC = () => {
  return (
    <UsersStyle>
      <Sidebar />
      <UserList />
    </UsersStyle>
  );
};