-
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
2 changed files
with
17 additions
and
98 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,87 +1,6 @@ | ||
import { Meta } from "@storybook/blocks"; | ||
import { Meta, Markdown } from "@storybook/blocks"; | ||
import Readme from "../README.md?raw"; | ||
|
||
<Meta title="指南/快速了解" /> | ||
|
||
{/* 当 https://github.com/quantizor/markdown-to-jsx/issues/529 和 embed-gist 支持后可以考虑直接使用 README */} | ||
|
||
# amap-react-components | ||
|
||
[![latest version](https://img.shields.io/npm/v/amap-react-components.svg?label=latest%20%20version)](https://www.npmjs.org/package/amap-react-components) | ||
[![License](https://img.shields.io/npm/l/amap-react-components?label=latest%20%20version%20%20license)](https://www.npmjs.org/package/amap-react-components) | ||
[![npm downloads](https://img.shields.io/npm/dm/amap-react-components.svg)](http://npmjs.com/amap-react-components) | ||
[![minimized gzipped size](https://img.shields.io/bundlejs/size/amap-react-components)](http://npmjs.com/amap-react-components) | ||
|
||
[![GitHub Repo stars](https://img.shields.io/github/stars/xyy94813/amap-react-components?label=github%20%20stars)](https://github.com/xyy94813/amap-react-components) | ||
[![last commit (branch)](https://img.shields.io/github/last-commit/xyy94813/amap-react-components/main)](https://github.com/xyy94813/amap-react-components) | ||
|
||
[![deploy-to-gh-pages](https://github.com/xyy94813/amap-react-components/actions/workflows/deploy-to-gh-pages.yml/badge.svg?branch=main)](https://github.com/xyy94813/amap-react-components/actions/workflows/deploy-to-gh-pages.yml) | ||
[![Codecov workflow](https://github.com/xyy94813/amap-react-components/actions/workflows/codecov.yml/badge.svg?branch=main)](https://github.com/xyy94813/amap-react-components/actions/workflows/codecov.yml) | ||
[![codecov](https://codecov.io/gh/xyy94813/amap-react-components/branch/main/graph/badge.svg?token=DCC845JGZW)](https://codecov.io/gh/xyy94813/amap-react-components) | ||
|
||
[AMap](https://lbs.amap.com/api/jsapi-v2/summary/) 的 React 组件。 | ||
|
||
> 注意: 仅支持 AMap V2 且 React >= 16.8. | ||
## 对比其他库 | ||
|
||
| | amap-react-components | @amap/amap-react | react-amap | | ||
| ---------------- | --------------------- | ---------------- | ------------------- | | ||
| 官方 | `否` | `是` | `否` (饿了么团队) | | ||
| 开源 | `是` | `否` | `是` | | ||
| 活跃度 | `较高` | `低` | `低` | | ||
| 使用文档 | `是` | `是` | `是` | | ||
| 单元测试覆盖率 | `高` | `未知` | `否` | | ||
| 基于 React Hooks | `是` | `未知` | `否` | | ||
| 支持 amap v2 | `是` | `是` | `否` | | ||
| 支持 amap ui | `是` | `是` | `是` | | ||
| 支持 TS | `是` | `是` | `是` | | ||
| 支持 Vite | `是` | `未知` | `未知` | | ||
| 自定义组件 | `是` | `是` | `是` | | ||
| UMD 模块 | `是` | `未知` | `是` | | ||
|
||
- [@amap/amap-react](https://www.npmjs.com/package/@amap/amap-react) (高德官方 react 组件 ) | ||
- [react-amap](https://github.com/elemefe/react-amap) | ||
|
||
## 使用 | ||
|
||
### 安装 | ||
|
||
``` | ||
yarn add amap-react-components | ||
// or | ||
// npm i amap-react-components | ||
``` | ||
|
||
### Browser | ||
|
||
提供 browser 后缀支持 UMD 模块 | ||
|
||
例如: | ||
|
||
``` | ||
https://cdn.jsdelivr.net/npm/amap-react-components@0.0.1/dist/amap-react-components.browser.js | ||
``` | ||
|
||
### Typescript | ||
|
||
安装官方的 jsapi 的 ts 声明 | ||
|
||
```shell | ||
npm install @amap/amap-jsapi-types | ||
``` | ||
|
||
由于官方 ts 声明存在声明错误、缺漏,以及缺少 AMapUI 相关接口声明等问题, | ||
本项目在官方声明上对接口声明做了改动。 | ||
|
||
因此,需要将声明文件 `./src/@types/AMap.d.ts` 复制进您的项目。 | ||
当使用了本项目暂时不支持的组件,您需要自定义组件时,可以在您的项目自行维护。 | ||
|
||
> 如过,有人知道如何将这部分声明文件在构建时一同打包进最终的输出中,麻烦告知我。 | ||
> 如果能看到您的 PR 那就更好了。 | ||
### Polyfill | ||
|
||
使用者可能需要自行处理以下兼容性 | ||
|
||
- [Proxy](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Proxy) | ||
--> [Proxy Polyfill](https://github.com/GoogleChrome/proxy-polyfill) | ||
<Markdown>{Readme}</Markdown> |