umijs / umi

A framework in react community ✨
https://umijs.org
MIT License
15.38k stars 2.65k forks source link

[Bug] singular 为 true 居然会导致 "export 'connect' was not found in 'umi' #6005

Closed ok2fly closed 3 years ago

ok2fly commented 3 years ago

What happens?

singular 为 true 居然会导致

也即 设置 pages 目录名 为单数单数 page

"export 'connect' was not found in 'umi'

Mini Showcase Repository(REQUIRED)

Provide a mini GitHub repository which can reproduce the issue. Use yarn create @umijs/umi-app then upload to your GitHub 请使用 yarn create @umijs/umi-app 创建,并上传到你的 GitHub 仓库

How To Reproduce

Steps to reproduce the behavior: 1. 2. 1 mkdir umi-app 2 npm init -y 3 yarn add -D umi @umijs/preset-react

4

import { defineConfig } from 'umi'
import routes from './routes'

export default defineConfig({
  singular: true,
  nodeModulesTransform: {
    type: 'none',
  },
  alias: {
    '@/models': 'src/models',
    '@/config': 'src/config',
  },
  dva: {
    immer: true,
    hmr: false,
  },
  routes,
})

5 创建一个 model

import {
  Effect,
  ConnectRC,
  // Reducer,
  ImmerReducer,
  Dispatch,
  Action,
  Subscription,
} from 'umi';

// export default <Model>{ namespace: 'foo' };
export interface IPuzzleCard {
  id: number;
  setup: string;
  punchline: string;
}

export interface IPuzzleCardsListState {
  cardsList: IPuzzleCard[];
}

export type TAction = Action<string> & { payload: any };

export interface PuzzleCardsListModelType {
  namespace: 'puzzlecards';
  state: IPuzzleCardsListState;
  reducers: {
    setState: ImmerReducer<IPuzzleCardsListState, TAction>;
  };
  effects: {
    fetchCards: Effect;
  };
  subscriptions?: {
    setup: Subscription;
  };
}

const puzzleCardsListState: IPuzzleCardsListState = {
  // cardsList: [],
  cardsList: [
    {
      id: 1,
      setup: 'Did you hear about the two silk worms in a race?',
      punchline: 'It ended in a tie',
    },
    {
      id: 2,
      setup: "What happens to a frog's car when it breaks down?",
      punchline: 'It gets toad away',
    },
  ],
};

const PuzzleCardsListModel: PuzzleCardsListModelType = {
  namespace: 'puzzlecards',
  state: puzzleCardsListState,
  reducers: {
    setState(state: IPuzzleCardsListState, action: TAction) {
      state.cardsList = action.payload;
    },
  },
  effects: {
    *fetchCards() {},
  },

export default PuzzleCardsListModel;

在一个页面引用

import { FC } from 'react'
import { Layout, Menu, Card } from 'antd'
import { PieChartOutlined, DashboardOutlined } from '@ant-design/icons'

// import { IPuzzleCardsListState, ConnectProps, Loading, ConnectRC } from 'umi';
import {
  IPuzzleCardsListState,
  ConnectProps,
  Loading,
  connect,
  Link,
} from 'umi'

import { IPuzzleCard } from '@/models/puzzlecards.model'
// IPuzzleCardsState

interface IPuzzleCardsPageProps extends ConnectProps {
  puzzlecards: IPuzzleCardsListState
}

// state 是根 rootModel
const mapStateToProps = ({
  puzzlecards,
  loading,
}: {
  puzzlecards: IPuzzleCardsListState
  loading: Loading
}) => {
  // console.log('----mapStateToProps----: ', state);

  return {
    puzzlecards,
    // loading: loading,
  }
}

const connector = connect(mapStateToProps)
// type ModelState = ConnectProps<typeof connector>;

const PuzzleCardsPage: FC<IPuzzleCardsPageProps> = (props) => {
  const { cardsList } = props.puzzlecards
  return (
    <div>
      card
      {cardsList.map((card: IPuzzleCard) => {
        return (
          <Card key={card.id}>
            <div>Q: {card.setup}</div>
            <div>
              <strong>A: {card.punchline}</strong>
            </div>
          </Card>
        )
      })}
    </div>
  )
}

export default connector(PuzzleCardsPage)

tsconfig

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "moduleResolution": "node",
    "importHelpers": true,
    "jsx": "react-jsx",
    "esModuleInterop": true,
    "sourceMap": true,
    "baseUrl": "./",
    "strict": true,
    "paths": {
      "@/*": ["src/*"],
      "@@/*": ["src/.umi/*"]
    },
    "allowSyntheticDefaultImports": true
  },
  "include": [
    "mock/**/*",
    "src/**/*",
    "config/**/*",
    "typings.d.ts"
  ],
  "exclude": [
    "node_modules",
    "lib",
    "es",
    "dist",
    "typings",
    "**/__test__",
    "test",
    "docs",
    "tests"
  ]
}

运行项目 终端就会输出

"export 'connect' was not found in 'umi'

Expected behavior 1. 2.

Context

sorrycc commented 3 years ago

singular: true 时找 model 目录会用 model,而不是 models