Экспорт по умолчанию не является компонентом React на странице: "/" для Next. js с gts

Question

Я использую Next. js с TypeScript и gts для своей конфигурации.

Эта конфигурация запрещает экспорт по умолчанию с помощью опции no-default-export.

Next. js вызывает ошибку, если страница индекса экспортирует класс без объявления по умолчанию.

Интересно, файл страницы в Next. js должен иметь экспорт по умолчанию или мой код просто неверен.

журнал ошибок

Error: The default export is not a React Component in page: "/"
    at Object.renderToHTML (/mnt/d/workspace/order/node_modules/next/dist/next-server/server/render.js:163:19)
    at DevServer.renderToHTMLWithComponents (/mnt/d/workspace/order/node_modules/next/dist/next-server/server/next-server.js:547:29)
    at /mnt/d/workspace/order/node_modules/next/dist/next-server/server/next-server.js:610:25
    at runMicrotasks (<anonymous>)
    at processTicksAndRejections (internal/process/task_queues.js:93:5)
    at async DevServer.renderToHTML (/mnt/d/workspace/order/node_modules/next/dist/server/next-dev-server.js:14:445)
    at async DevServer.render (/mnt/d/workspace/order/node_modules/next/dist/next-server/server/next-server.js:490:22)
    at async Object.fn (/mnt/d/workspace/order/node_modules/next/dist/next-server/server/next-server.js:349:17)
    at async Router.execute (/mnt/d/workspace/order/node_modules/next/dist/next-server/server/router.js:42:32)
    at async DevServer.run (/mnt/d/workspace/order/node_modules/next/dist/next-server/server/next-server.js:

/ src / pages / index.tsx

import styled from 'styled-components';
import { Breadcrumb, Icon, Row, Col, Layout, Card, Carousel, Menu } from 'antd';
import Link from 'next/link';
import React from 'react';

import { SideMenu } from '@components/menu/SideMenu';

const { Header, Content, Sider } = Layout;

export class Index extends React.Component {
  state = {
    collapsed: false,
  };

  toggle = () => {
    this.setState({
      collapsed: !this.state.collapsed,
    });
  };

  render() {
    return (
      <Layout>
        <Header style={{ background: '#fff', padding: 0 }}>
          <Icon
            className="trigger"
            type={this.state.collapsed ? 'menu-unfold' : 'menu-fold'}
            onClick={this.toggle}
          />
        </Header>
        <Layout>
          <Sider trigger={null} collapsible collapsed={this.state.collapsed}>
            <div className="logo" />
            <Menu theme="dark" mode="inline" defaultSelectedKeys={['1']}>
              <Menu.Item key="1">
                <Icon type="user" />
                <span>nav 1</span>
              </Menu.Item>
              <Menu.Item key="2">
                <Icon type="video-camera" />
                <span>nav 2</span>
              </Menu.Item>
              <Menu.Item key="3">
                <Icon type="upload" />
                <span>nav 3</span>
              </Menu.Item>
            </Menu>
          </Sider>
          <Layout>
            <Content
              style={{
                margin: '24px 16px',
                padding: 24,
                background: '#fff',
                minHeight: 280,
              }}
            >
              Content
            </Content>
          </Layout>
        </Layout>
      </Layout>
    );
  }
}

пакет. json

{
  "dependencies": {
    "@types/styled-components": "^4.4.2",
    "@zeit/next-css": "^1.0.1",
    "@zeit/next-less": "^1.0.1",
    "antd": "^3.9.2",
    "babel-plugin-import": "^1.13.0",
    "less": "^3.10.3",
    "less-vars-to-js": "^1.3.0",
    "next": "^9.1.7",
    "react": "^16.12.0",
    "react-dom": "^16.12.0",
    "styled-components": "^4.4.1"
  },
  "scripts": {
    "dev": "next",
    "build": "next build",
    "start": "next start",
    "script-check": "gts check",
    "clean": "gts clean",
    "compile": "tsc -p .",
    "fix": "gts fix",
    "prepare": "yarn run compile",
    "pretest": "yarn run compile",
    "posttest": "yarn run check"
  },
  "devDependencies": {
    "@types/node": "^10.0.3",
    "@types/react": "^16.9.17",
    "babel-plugin-module-resolver": "^4.0.0",
    "babel-plugin-styled-components": "^1.10.6",
    "gts": "^1.1.2",
    "typescript": "~3.7.0"
  }
}

tsconfig. json

{
  "extends": "./node_modules/gts/tsconfig-google.json",
  "compilerOptions": {
    "rootDir": ".",
    "outDir": "build",
    "jsx": "preserve",
    "allowJs": true,
    "skipLibCheck": true,
    "noEmit": true,
    "esModuleInterop": true,
    "module": "esnext",
    "target": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "baseUrl": ".",
    "paths": {
      "@components/*": [
        "./src/components/*"
      ]
    },
    "isolatedModules": true
  },
  "include": [
    "pages/**/*.tsx",
    "src/**/*.tsx",
    "test/**/*.tsx"
  ],
}