ant-design/12248e42-async.66fc4963.js

(("undefined"!=typeof globalThis?globalThis:self).makoChunk_antd=("undefined"!=typeof globalThis?globalThis:self).makoChunk_antd||[]).push([["12248e42"],{"12248e42":function(a,e,t){"use strict";t.d(e,"__esModule",{value:!0}),t.d(e,"texts",{enumerable:!0,get:function(){return n;}}),t("d5f11379");let n=[{value:"Farm",paraId:0},{value:" is a Rust-Based Web Building Engine to Facilitate Your Web Program and JavaScript Library. This article will try to use ",paraId:0},{value:"Farm",paraId:0},{value:" to create a project and import antd.",paraId:0},{value:"Before all start, you may need install ",paraId:1,tocIndex:0},{value:"yarn",paraId:1,tocIndex:0},{value:" or ",paraId:1,tocIndex:0},{value:"pnpm",paraId:1,tocIndex:0},{value:" or ",paraId:1,tocIndex:0},{value:"bun",paraId:1,tocIndex:0},{value:".",paraId:1,tocIndex:0},{value:"During the initialization process, ",paraId:2},{value:"farm",paraId:2},{value:" provides a series of templates for us to choose, We need choose the ",paraId:2},{value:"React",paraId:2},{value:" template.",paraId:2},{value:"The tool will create and initialize environment and dependencies automatically, please try config your proxy setting or use another npm registry if any network errors happen during it.",paraId:3},{value:"Then we go inside project and start it.",paraId:4},{value:"$ cd farm-project\n$ npm install\n$ npm start\n",paraId:5},{value:"Open the browser at ",paraId:6},{value:"http://localhost:9000",paraId:6},{value:". It renders a title saying ",paraId:6},{value:"Farm with React",paraId:6},{value:" on the page, which is considered successful.",paraId:6},{value:"Now we install ",paraId:7,tocIndex:1},{value:"antd",paraId:7,tocIndex:1},{value:" from yarn or npm or pnpm or bun.",paraId:7,tocIndex:1},{value:"Modify ",paraId:8},{value:"src/main.tsx",paraId:8},{value:", import Button component from ",paraId:8},{value:"antd",paraId:8},{value:".",paraId:8},{value:"import React from 'react';\nimport { Button } from 'antd';\n\nexport function Main() {\n  return (\n    <div>\n      <Button type=\"primary\">Button</Button>\n    </div>\n  );\n}\n",paraId:9},{value:"OK, you should now see a blue primary button displayed on the page. Next you can choose any components of ",paraId:10},{value:"antd",paraId:10},{value:" to develop your application. Visit other workflows of ",paraId:10},{value:"Farm",paraId:10},{value:" at its ",paraId:10},{value:"Official documentation",paraId:10},{value:".",paraId:10},{value:"Ref to the ",paraId:11,tocIndex:2},{value:"Customize Theme documentation",paraId:12,tocIndex:2},{value:". Modify theme with ConfigProvider:",paraId:11,tocIndex:2},{value:"import React from 'react';\nimport { Button, ConfigProvider } from 'antd';\n\nexport function Main() {\n  return (\n    <ConfigProvider theme={{ token: { colorPrimary: '#00b96b' } }}>\n      <Button type=\"primary\">Button</Button>\n    </ConfigProvider>\n  );\n}\n",paraId:13,tocIndex:2},{value:"We are successfully running the antd components using Rsbuild now, let\u2019s start build your own application!",paraId:14,tocIndex:2}];}}]);