Ampersand React 库
概览
安珀斯兰 是SaaS公司制造者的一个声明平台,他们正在创建产品集成.
这个寄存器包含Ampersand React库,一组Resact组件,允许你的终端用户安装和管理Ampersand集成.
先决条件
- 反应版本 18+
Next.js App路由器
这个库使用React hooks,浏览器API,以及整个客户端的依赖性,使其成为客户端的库. 当使用 Next.js App 路由器(v13+)时,确保从 @amp-labs/react 处于客户边界内.
图书馆包括: 'use client' 因此,它在大多数情况下应自动发挥作用。 如果遇到 SSR 相关错误,请将您的用法包入客户端组件 :
'use client';
import { AmpersandProvider, ConnectProvider } from '@amp-labs/react';
export function MyIntegrationComponent() {
return (
<AmpersandProvider options={options}>
<ConnectProvider /* ... */ />
</AmpersandProvider>
);
}
后遗症 (@amp-labs/ react 1.x.x)
要求数
- 查克拉 2.4.4 - 2.10 (中文(简体) )https://charkra-ui.com/getting-started 页面存档备份,存于互联网档案馆(中文(简体) )
- Chakra 对等依赖性 : @ emotion/ react, @ emotion/ styled, framer-motion
安装
在您的还款中, 使用 npm 或者说 yarn 安装软件包 @amp-labs/react数字 :
npm install @amp-labs/react
yarn add @amp-labs/react
从 1.x.x 迁移到 @amp-labs/ react 2.0+
@amp-labs/ react 2.0+ 不再需要 chakra作为依赖. Chakra 依赖关系 (@ chakra-ui/ react@emotion/ react@emotion/ styped framer-motion) (中文(简体) ) 不再需要.
@amp-labs/ react 现在轮船有它自己的样式表 也允许用户覆盖颜色, 字体,以及其它 Cs 变量。 见 用法变化
后遗症 (@amp-labs/ react 1.x.x)
如果你在使用纱线,你还必须安装对等依赖.
yarn add @amp-labs/react @chakra-ui/react @emotion/react @emotion/styled framer-motion
使用量
请访问 我们的文件 学习如何使用这个图书馆.
更改为 2.0
除导入组件外,默认样式表也必须被导入. 您也可以覆盖
--amp 默认的 cs 变量 样式 通过导入您的样式表.
import { AmpersandProvider } from '@amp-labs/react';
import '@amp-labs/react/styles'; // amp-labs style sheet
import './App.css'; // optional: your own css override
const options = {
project: 'PROJECT', // Your Ampersand project name or ID.
apiKey: 'API_KEY',// Your Ampersand API key.
};
function App() {
return (
// Wrap all your components inside AmpersandProvider.
// You can either do this at the App level,
// or further down in the component tree.
<AmpersandProvider options={options}>
// You can use any of the Ampersand components here.
...
</AmpersandProvider>
)
}
许可证
此寄存器根据 麻省理工学院许可证。 。 。 .
阅读此牌照,请查看 利比里亚。 。 。 .
地方发展
请看 捐款额。 。 。 .