ant-design-pro 实做

脚手架通过结合一些配置文件、基本算法及工具函数,搭建好了路由和菜单的基本框架,主要涉及以下几个模块/功能:

  • 路由管理 通过约定的语法根据在 router.config.js 中配置路由。

  • 菜单生成 根据路由配置来生成菜单。菜单项名称,嵌套路径与路由高度耦合。

  • 面包屑 组件 PageHeader 中内置的面包屑也可由脚手架提供的配置信息自动生成。

下面简单介绍下各个模块的基本思路,如果你对实现过程不感兴趣,只想了解应该怎么实现相关需求,可以直接查看需求实例

1.创建工程

[livingbody@localhost antdtest]$ git clone --depth=1 https://github.com/ant-design/ant-design-pro.git my-project
正克隆到 'my-project'...
remote: Enumerating objects: 552, done.
remote: Counting objects: 100% (552/552), done.
remote: Compressing objects: 100% (509/509), done.
remote: Total 552 (delta 46), reused 232 (delta 25), pack-reused 0
接收对象中: 100% (552/552), 277.22 KiB | 75.00 KiB/s, 完成.
处理 delta 中: 100% (46/46), 完成.
[livingbody@localhost antdtest]$ cd my-project/

2.工程结构 

[livingbody@localhost my-project]$ tree
.
├── appveyor.yml
├── CODE_OF_CONDUCT.md
├── config
│   ├── config.js
│   ├── plugin.config.js
│   └── router.config.js
├── docker
│   ├── docker-compose.dev.yml
│   ├── docker-compose.yml
│   └── nginx.conf
├── Dockerfile
├── Dockerfile.dev
├── Dockerfile.hub
├── firebase.json
├── functions
│   ├── index.js
│   ├── matchMock.js
│   └── package.json
├── jest.config.js
├── jest-puppeteer.config.js
├── jsconfig.json
├── LICENSE
├── mock
│   ├── api.js
│   ├── chart.js
│   ├── geographic
│   │   ├── city.json
│   │   └── province.json
│   ├── geographic.js
│   ├── notices.js
│   ├── profile.js
│   ├── rule.js
│   └── user.js
├── netlify.toml
├── package.json
├── public
│   ├── favicon.png
│   └── icons
│       ├── icon-128x128.png
│       ├── icon-192x192.png
│       └── icon-512x512.png
├── README.md
├── README.ru-RU.md
├── README.zh-CN.md
├── scripts
│   ├── generateMock.js
│   ├── lint-prettier.js
│   └── prettier.js
├── src
│   ├── assets
│   │   └── logo.svg
│   ├── components
│   │   ├── ActiveChart
│   │   │   ├── index.js
│   │   │   └── index.less
│   │   ├── ArticleListContent
│   │   │   ├── index.js
│   │   │   └── index.less
│   │   ├── Authorized
│   │   │   ├── Authorized.js
│   │   │   ├── AuthorizedRoute.d.ts
│   │   │   ├── AuthorizedRoute.js
│   │   │   ├── CheckPermissions.js
│   │   │   ├── CheckPermissions.test.js
│   │   │   ├── demo
│   │   │   │   ├── AuthorizedArray.md
│   │   │   │   ├── AuthorizedFunction.md
│   │   │   │   ├── basic.md
│   │   │   │   └── secured.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.js
│   │   │   ├── index.md
│   │   │   ├── PromiseRender.js
│   │   │   ├── renderAuthorize.js
│   │   │   └── Secured.js
│   │   ├── AvatarList
│   │   │   ├── AvatarItem.d.ts
│   │   │   ├── demo
│   │   │   │   ├── maxLength.md
│   │   │   │   └── simple.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.en-US.md
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   ├── index.test.js
│   │   │   └── index.zh-CN.md
│   │   ├── Charts
│   │   │   ├── autoHeight.js
│   │   │   ├── Bar
│   │   │   │   ├── index.d.ts
│   │   │   │   └── index.js
│   │   │   ├── bizcharts.d.ts
│   │   │   ├── bizcharts.js
│   │   │   ├── ChartCard
│   │   │   │   ├── index.d.ts
│   │   │   │   ├── index.js
│   │   │   │   └── index.less
│   │   │   ├── demo
│   │   │   │   ├── bar.md
│   │   │   │   ├── chart-card.md
│   │   │   │   ├── gauge.md
│   │   │   │   ├── mini-area.md
│   │   │   │   ├── mini-bar.md
│   │   │   │   ├── mini-pie.md
│   │   │   │   ├── mini-progress.md
│   │   │   │   ├── mix.md
│   │   │   │   ├── pie.md
│   │   │   │   ├── radar.md
│   │   │   │   ├── tag-cloud.md
│   │   │   │   ├── timeline-chart.md
│   │   │   │   └── waterwave.md
│   │   │   ├── Field
│   │   │   │   ├── index.d.ts
│   │   │   │   ├── index.js
│   │   │   │   └── index.less
│   │   │   ├── g2.js
│   │   │   ├── Gauge
│   │   │   │   ├── index.d.ts
│   │   │   │   └── index.js
│   │   │   ├── index.d.ts
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   ├── index.md
│   │   │   ├── MiniArea
│   │   │   │   ├── index.d.ts
│   │   │   │   └── index.js
│   │   │   ├── MiniBar
│   │   │   │   ├── index.d.ts
│   │   │   │   └── index.js
│   │   │   ├── MiniProgress
│   │   │   │   ├── index.d.ts
│   │   │   │   ├── index.js
│   │   │   │   └── index.less
│   │   │   ├── Pie
│   │   │   │   ├── index.d.ts
│   │   │   │   ├── index.js
│   │   │   │   └── index.less
│   │   │   ├── Radar
│   │   │   │   ├── index.d.ts
│   │   │   │   ├── index.js
│   │   │   │   └── index.less
│   │   │   ├── TagCloud
│   │   │   │   ├── index.d.ts
│   │   │   │   ├── index.js
│   │   │   │   └── index.less
│   │   │   ├── TimelineChart
│   │   │   │   ├── index.d.ts
│   │   │   │   ├── index.js
│   │   │   │   └── index.less
│   │   │   └── WaterWave
│   │   │       ├── index.d.ts
│   │   │       ├── index.js
│   │   │       └── index.less
│   │   ├── CountDown
│   │   │   ├── demo
│   │   │   │   └── simple.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.en-US.md
│   │   │   ├── index.js
│   │   │   └── index.zh-CN.md
│   │   ├── DescriptionList
│   │   │   ├── demo
│   │   │   │   ├── basic.md
│   │   │   │   └── vertical.md
│   │   │   ├── Description.d.ts
│   │   │   ├── Description.js
│   │   │   ├── DescriptionList.js
│   │   │   ├── index.d.ts
│   │   │   ├── index.en-US.md
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   ├── index.zh-CN.md
│   │   │   └── responsive.js
│   │   ├── EditableItem
│   │   │   ├── index.js
│   │   │   └── index.less
│   │   ├── EditableLinkGroup
│   │   │   ├── index.js
│   │   │   └── index.less
│   │   ├── Ellipsis
│   │   │   ├── demo
│   │   │   │   ├── line.md
│   │   │   │   └── number.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.en-US.md
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   ├── index.test.js
│   │   │   └── index.zh-CN.md
│   │   ├── Exception
│   │   │   ├── demo
│   │   │   │   ├── 403.md
│   │   │   │   ├── 404.md
│   │   │   │   └── 500.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.en-US.md
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   ├── index.zh-CN.md
│   │   │   └── typeConfig.js
│   │   ├── FooterToolbar
│   │   │   ├── demo
│   │   │   │   └── basic.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.en-US.md
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   └── index.zh-CN.md
│   │   ├── GlobalFooter
│   │   │   ├── demo
│   │   │   │   └── basic.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   └── index.md
│   │   ├── GlobalHeader
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   └── RightContent.js
│   │   ├── HeaderDropdown
│   │   │   ├── index.js
│   │   │   └── index.less
│   │   ├── HeaderSearch
│   │   │   ├── demo
│   │   │   │   └── basic.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.en-US.md
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   └── index.zh-CN.md
│   │   ├── Login
│   │   │   ├── demo
│   │   │   │   └── basic.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.en-US.md
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   ├── index.zh-CN.md
│   │   │   ├── loginContext.js
│   │   │   ├── LoginItem.d.ts
│   │   │   ├── LoginItem.js
│   │   │   ├── LoginSubmit.js
│   │   │   ├── LoginTab.d.ts
│   │   │   ├── LoginTab.js
│   │   │   └── map.js
│   │   ├── NoticeIcon
│   │   │   ├── demo
│   │   │   │   ├── basic.md
│   │   │   │   └── popover.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.en-US.md
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   ├── index.zh-CN.md
│   │   │   ├── NoticeIconTab.d.ts
│   │   │   ├── NoticeList.js
│   │   │   └── NoticeList.less
│   │   ├── NumberInfo
│   │   │   ├── demo
│   │   │   │   └── basic.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.en-US.md
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   └── index.zh-CN.md
│   │   ├── PageHeader
│   │   │   ├── breadcrumb.d.ts
│   │   │   ├── breadcrumb.js
│   │   │   ├── demo
│   │   │   │   ├── image.md
│   │   │   │   ├── simple.md
│   │   │   │   ├── standard.md
│   │   │   │   └── structure.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   ├── index.md
│   │   │   └── index.test.js
│   │   ├── PageHeaderWrapper
│   │   │   ├── GridContent.js
│   │   │   ├── GridContent.less
│   │   │   ├── index.js
│   │   │   └── index.less
│   │   ├── PageLoading
│   │   │   └── index.js
│   │   ├── Result
│   │   │   ├── demo
│   │   │   │   ├── classic.md
│   │   │   │   ├── error.md
│   │   │   │   └── structure.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   └── index.md
│   │   ├── SelectLang
│   │   │   ├── index.js
│   │   │   └── index.less
│   │   ├── SettingDrawer
│   │   │   ├── BlockCheckbox.js
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   ├── ThemeColor.js
│   │   │   └── ThemeColor.less
│   │   ├── SiderMenu
│   │   │   ├── BaseMenu.js
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   ├── SiderMenu.js
│   │   │   ├── SiderMenu.test.js
│   │   │   └── SiderMenuUtils.js
│   │   ├── StandardFormRow
│   │   │   ├── index.js
│   │   │   └── index.less
│   │   ├── StandardTable
│   │   │   ├── index.js
│   │   │   └── index.less
│   │   ├── TagSelect
│   │   │   ├── demo
│   │   │   │   ├── controlled.md
│   │   │   │   ├── expandable.md
│   │   │   │   └── simple.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   ├── index.md
│   │   │   └── TagSelectOption.d.ts
│   │   ├── TopNavHeader
│   │   │   ├── index.js
│   │   │   └── index.less
│   │   ├── Trend
│   │   │   ├── demo
│   │   │   │   ├── basic.md
│   │   │   │   └── reverse.md
│   │   │   ├── index.d.ts
│   │   │   ├── index.js
│   │   │   ├── index.less
│   │   │   └── index.md
│   │   └── _utils
│   │       ├── pathTools.js
│   │       └── pathTools.test.js
│   ├── defaultSettings.js
│   ├── e2e
│   │   ├── baseLayout.e2e.js
│   │   ├── home.e2e.js
│   │   ├── login.e2e.js
│   │   ├── topMenu.e2e.js
│   │   └── userLayout.e2e.js
│   ├── global.js
│   ├── global.less
│   ├── layouts
│   │   ├── BasicLayout.js
│   │   ├── BasicLayout.less
│   │   ├── BlankLayout.js
│   │   ├── Footer.js
│   │   ├── Header.js
│   │   ├── Header.less
│   │   ├── MenuContext.js
│   │   ├── UserLayout.js
│   │   └── UserLayout.less
│   ├── locales
│   │   ├── en-US
│   │   │   ├── analysis.js
│   │   │   ├── exception.js
│   │   │   ├── form.js
│   │   │   ├── globalHeader.js
│   │   │   ├── login.js
│   │   │   ├── menu.js
│   │   │   ├── monitor.js
│   │   │   ├── pwa.js
│   │   │   ├── result.js
│   │   │   ├── settingDrawer.js
│   │   │   └── settings.js
│   │   ├── en-US.js
│   │   ├── pt-BR
│   │   │   ├── analysis.js
│   │   │   ├── exception.js
│   │   │   ├── form.js
│   │   │   ├── globalHeader.js
│   │   │   ├── login.js
│   │   │   ├── menu.js
│   │   │   ├── monitor.js
│   │   │   ├── pwa.js
│   │   │   ├── result.js
│   │   │   ├── settingDrawer.js
│   │   │   └── settings.js
│   │   ├── pt-BR.js
│   │   ├── zh-CN
│   │   │   ├── analysis.js
│   │   │   ├── exception.js
│   │   │   ├── form.js
│   │   │   ├── globalHeader.js
│   │   │   ├── login.js
│   │   │   ├── menu.js
│   │   │   ├── monitor.js
│   │   │   ├── pwa.js
│   │   │   ├── result.js
│   │   │   ├── settingDrawer.js
│   │   │   └── settings.js
│   │   ├── zh-CN.js
│   │   ├── zh-TW
│   │   │   ├── analysis.js
│   │   │   ├── exception.js
│   │   │   ├── form.js
│   │   │   ├── globalHeader.js
│   │   │   ├── login.js
│   │   │   ├── menu.js
│   │   │   ├── monitor.js
│   │   │   ├── pwa.js
│   │   │   ├── result.js
│   │   │   ├── settingDrawer.js
│   │   │   └── settings.js
│   │   └── zh-TW.js
│   ├── manifest.json
│   ├── models
│   │   ├── global.js
│   │   ├── list.js
│   │   ├── login.js
│   │   ├── menu.js
│   │   ├── project.js
│   │   ├── setting.js
│   │   └── user.js
│   ├── pages
│   │   ├── 404.js
│   │   ├── Account
│   │   │   ├── Center
│   │   │   │   ├── Applications.js
│   │   │   │   ├── Articles.js
│   │   │   │   ├── Articles.less
│   │   │   │   ├── Center.js
│   │   │   │   ├── Center.less
│   │   │   │   └── Projects.js
│   │   │   └── Settings
│   │   │       ├── BaseView.js
│   │   │       ├── BaseView.less
│   │   │       ├── BindingView.js
│   │   │       ├── GeographicView.js
│   │   │       ├── GeographicView.less
│   │   │       ├── Info.js
│   │   │       ├── Info.less
│   │   │       ├── models
│   │   │       │   └── geographic.js
│   │   │       ├── NotificationView.js
│   │   │       ├── PhoneView.js
│   │   │       ├── PhoneView.less
│   │   │       └── SecurityView.js
│   │   ├── Authorized.js
│   │   ├── Dashboard
│   │   │   ├── Analysis.js
│   │   │   ├── Analysis.less
│   │   │   ├── IntroduceRow.js
│   │   │   ├── models
│   │   │   │   ├── activities.js
│   │   │   │   ├── chart.js
│   │   │   │   └── monitor.js
│   │   │   ├── Monitor.js
│   │   │   ├── Monitor.less
│   │   │   ├── OfflineData.js
│   │   │   ├── ProportionSales.js
│   │   │   ├── SalesCard.js
│   │   │   ├── TopSearch.js
│   │   │   ├── Workplace.js
│   │   │   └── Workplace.less
│   │   ├── document.ejs
│   │   ├── Exception
│   │   │   ├── 403.js
│   │   │   ├── 404.js
│   │   │   ├── 500.js
│   │   │   ├── models
│   │   │   │   └── error.js
│   │   │   ├── style.less
│   │   │   └── TriggerException.js
│   │   ├── Forms
│   │   │   ├── AdvancedForm.js
│   │   │   ├── BasicForm.js
│   │   │   ├── models
│   │   │   │   └── form.js
│   │   │   ├── StepForm
│   │   │   │   ├── index.js
│   │   │   │   ├── Step1.js
│   │   │   │   ├── Step2.js
│   │   │   │   ├── Step3.js
│   │   │   │   └── style.less
│   │   │   ├── style.less
│   │   │   └── TableForm.js
│   │   ├── List
│   │   │   ├── Applications.js
│   │   │   ├── Applications.less
│   │   │   ├── Articles.js
│   │   │   ├── Articles.less
│   │   │   ├── BasicList.js
│   │   │   ├── BasicList.less
│   │   │   ├── CardList.js
│   │   │   ├── CardList.less
│   │   │   ├── List.js
│   │   │   ├── models
│   │   │   │   └── rule.js
│   │   │   ├── Projects.js
│   │   │   ├── Projects.less
│   │   │   ├── TableList.js
│   │   │   └── TableList.less
│   │   ├── Profile
│   │   │   ├── AdvancedProfile.js
│   │   │   ├── AdvancedProfile.less
│   │   │   ├── BasicProfile.js
│   │   │   ├── BasicProfile.less
│   │   │   └── models
│   │   │       └── profile.js
│   │   ├── Result
│   │   │   ├── Error.js
│   │   │   ├── Success.js
│   │   │   └── Success.test.js
│   │   └── User
│   │       ├── Login.js
│   │       ├── Login.less
│   │       ├── models
│   │       │   └── register.js
│   │       ├── Register.js
│   │       ├── Register.less
│   │       ├── RegisterResult.js
│   │       └── RegisterResult.less
│   ├── services
│   │   ├── api.js
│   │   ├── error.js
│   │   ├── geographic.js
│   │   └── user.js
│   ├── service-worker.js
│   └── utils
│       ├── authority.js
│       ├── authority.test.js
│       ├── Authorized.js
│       ├── request.js
│       ├── utils.js
│       ├── utils.less
│       ├── utils.test.js
│       └── Yuan.js
├── tests
│   └── run-tests.js
├── tsconfig.json
└── tslint.json

102 directories, 437 files

3.依赖安装 

[livingbody@localhost my-project]$ sudo cnpm install
⠸ [60/64] Installing [email protected] unsupported [email protected][email protected][email protected] › fsevents@^1.2.2 Package require os(darwin) not compatible with your platform(linux)
[fsevents@^1.2.2] optional install error: Package require os(darwin) not compatible with your platform(linux)
✔ Installed 64 packages
✔ Linked 1699 latest versions
Downloading Chromium r609904 - 106.4 Mb [====================] 100% 0.0s 
Chromium downloaded to /home/livingbody/antdtest/my-project/node_modules/[email protected]@puppeteer/.local-chromium/linux-609904
husky > setting up git hooks
husky > done
Love Preact? You can now donate to our open collective:
 > https://opencollective.com/preact/donate
✔ Run 3 scripts
peerDependencies link [email protected] in /home/livingbody/antdtest/my-project/node_modules/[email protected]@react-redux unmet with /home/livingbody/antdtest/my-project/node_modules/redux(4.0.1)
peerDependencies link [email protected] in /home/livingbody/antdtest/my-project/node_modules/[email protected]@react-redux unmet with /home/livingbody/antdtest/my-project/node_modules/redux(4.0.1)
peerDependencies link [email protected] in /home/livingbody/antdtest/my-project/node_modules/[email protected]@workbox-webpack-plugin unmet with /home/livingbody/antdtest/my-project/node_modules/webpack(4.28.1)
peerDependencies link [email protected] in /home/livingbody/antdtest/my-project/node_modules/[email protected]@react-router-config unmet with /home/livingbody/antdtest/my-project/node_modules/react(16.7.0)
peerDependencies link [email protected] in /home/livingbody/antdtest/my-project/node_modules/[email protected]@enzyme-adapter-react-16 unmet with /home/livingbody/antdtest/my-project/node_modules/enzyme(3.8.0)
peerDependencies link [email protected] in /home/livingbody/antdtest/my-project/node_modules/[email protected]@enzyme-adapter-react-16 unmet with /home/livingbody/antdtest/my-project/node_modules/react(16.7.0)
peerDependencies link [email protected] in /home/livingbody/antdtest/my-project/node_modules/[email protected]@enzyme-adapter-react-16 unmet with /home/livingbody/antdtest/my-project/node_modules/react-dom(16.7.0)
peerDependencies link [email protected] in /home/livingbody/antdtest/my-project/node_modules/[email protected]@enzyme-adapter-utils unmet with /home/livingbody/antdtest/my-project/node_modules/react(16.7.0)
peerDependencies link [email protected] in /home/livingbody/antdtest/my-project/node_modules/[email protected]@react-test-renderer unmet with /home/livingbody/antdtest/my-project/node_modules/react(16.7.0)
peerDependencies link [email protected] in /home/livingbody/antdtest/my-project/node_modules/[email protected]@fork-ts-checker-webpack-plugin unmet with /home/livingbody/antdtest/my-project/node_modules/tslint(5.12.0)
peerDependencies link [email protected] in /home/livingbody/antdtest/my-project/node_modules/[email protected]@tslint-loader unmet with /home/livingbody/antdtest/my-project/node_modules/tslint(5.12.0)
peerDependencies link [email protected] in /home/livingbody/antdtest/my-project/node_modules/[email protected]@react-dom unmet with /home/livingbody/antdtest/my-project/node_modules/react(16.7.0)
peerDependencies WARNING react-fittext@^1.0.0 requires a peer of react@^15.0.0 but [email protected] was installed
peerDependencies WARNING [email protected][email protected][email protected] requires a peer of [email protected] but [email protected] was installed
peerDependencies WARNING [email protected][email protected][email protected] requires a peer of dva-core@^1.1.0 but [email protected] was installed
peerDependencies WARNING react-fittext@^1.0.0 requires a peer of react-dom@^15.0.0 but [email protected] was installed
deprecate [email protected][email protected] This project is no longer maintained.
deprecate [email protected][email protected][email protected][email protected] › circular-json@^0.3.1 CircularJSON is in maintenance only, flatted is its successor.
deprecate [email protected][email protected][email protected][email protected][email protected][email protected] › object-keys@~0.2.0 Please update to the latest object-keys
anti semver [email protected][email protected][email protected][email protected][email protected] delcares [email protected](resolved as 1.9.0) but using ancestor(umi-build-dev)'s dependency [email protected](resolved as 1.8.1)
deprecate [email protected][email protected][email protected][email protected][email protected][email protected] › kleur@^2.0.1 Please upgrade to kleur@3 or migrate to 'ansi-colors' if you prefer the old syntax. Visit <https://github.com/lukeed/kleur/releases/tag/v3.0.0\> for migration path(s).
Recently updated (since 2018-12-21): 45 packages (detail see file /home/livingbody/antdtest/my-project/node_modules/.recently_updates.txt)
  Today:
    → [email protected][email protected] › caniuse-lite@^1.0.30000921(1.0.30000925) (11:32:38)
    → [email protected] › caniuse-db@^1.0.30000889(1.0.30000925) (10:55:22)
    → umi@^2.2.7(2.3.0) (10:50:14)
    → umi-plugin-react@^1.2.0(1.3.0) (10:49:59)
    → [email protected][email protected](1.3.0) (10:49:19)
    → [email protected][email protected](1.3.0) (10:50:09)
    → [email protected][email protected](1.3.0) (10:49:30)
    → [email protected][email protected](1.3.0) (10:49:35)
    → [email protected][email protected](1.3.0) (10:49:44)
    → [email protected][email protected](1.3.0) (10:49:40)
    → [email protected][email protected][email protected](1.3.0) (10:49:13)
    → [email protected][email protected](1.3.0) (10:49:55)
    → [email protected][email protected](2.3.0) (10:49:49)
    → [email protected][email protected][email protected](1.3.0) (10:50:05)
    → [email protected][email protected][email protected][email protected] › interpret@^1.0.0(1.2.0) (10:56:08)
✔ All packages installed (2035 packages installed from npm registry, used 3m(network 54s), speed 797.85kB/s, json 1763(4.06MB), tarball 37.91MB)

4.启动工程 

[livingbody@localhost my-project]$ sudo cnpm start
[sudo] livingbody 的密码:

> [email protected] start /home/livingbody/antdtest/my-project
> cross-env APP_TYPE=site umi dev


✔ Webpack
  Compiled successfully in 33.42s

(node:13381) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
Starting the development server...

Theme generated successfully
 DONE  Compiled successfully in 33418ms                                                    14:30:19


  App running at:
  - Local:   http://localhost:8000/ (copied to clipboard)
  - Network: http://192.168.43.47:8000/

 WAIT  Compiling...                                                                        14:30:20

(node:13381) UnhandledPromiseRejectionWarning: Error: Couldn't find the required `xsel` binary. On Debian/Ubuntu you can install it with: sudo apt install xsel
    at handler (/home/livingbody/antdtest/my-project/node_modules/[email protected]@clipboardy/lib/linux.js:7:9)
    at process._tickCallback (internal/process/next_tick.js:68:7)
(node:13381) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 12)
(node:13381) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.

✔ Webpack
  Compiled successfully in 2.77s

 DONE  Compiled successfully in 2770ms                                                     14:30:23

5.getting the target... 

猜你喜欢

转载自blog.csdn.net/livingbody/article/details/85321687
今日推荐