Welcome to your guide on using Choerodon UI, a top-notch UI design language tailored for enterprise applications. Leveraging React, this design language offers a sleek set of components, solid TypeScript support, and a delightful developer experience.
Features of Choerodon UI
- Incorporates the interactive language and visual style of enterprise-level medium and backstage products.
- Provides a set of high-quality React components ready for immediate use.
- Written in TypeScript, which ensures predictable static types.
- Includes a comprehensive package of development and design resources and tools.
Environment Support
Choerodon UI supports:
- Modern browsers and Internet Explorer 9+ (with polyfills).
- Server-side rendering capabilities.
- Electron for desktop applications.
Installation Guide
To install Choerodon UI in your project, run the following command in your terminal:
bash
npm install choerodon-ui --save
Using Choerodon UI
Here’s how you can start using Choerodon UI components in your React application:
jsx
import DatePicker from 'choerodon-ui';
import Table from 'choerodon-ui/pro';
ReactDOM.render(
, mountNode);
Ensure you manually import styles using either CSS or LESS:
jsx
import 'choerodon-ui/dist/choerodon-ui.css';
// or
import 'choerodon-ui/dist/choerodon-ui.less';
import 'choerodon-ui/dist/choerodon-ui-pro.css';
// or
import 'choerodon-ui/dist/choerodon-ui-pro.less';
Alternatively, import components on demand to optimize your bundle size.
Internationalization Support
For multi-language support, refer to the i18n documentation.
Ready to Dive Deeper?
Explore more resources on Choerodon UI:
Local Development Setup
To set up local development, clone the repository and start the project:
bash
git clone https://github.com/open-hand/choerodon-ui.git
cd choerodon-ui
npm install
npm start
Deployment Instructions
When ready to deploy, use the following commands:
bash
npm run deploy
Publishing Your Application
Finally, to publish your changes, execute:
bash
npm run pub
Accessing the Application
Open your browser and navigate to 127.0.0.1:8001 for more interactive examples and detailed tutorials.
Troubleshooting
If you encounter any issues during installation or setup, here are a few troubleshooting tips:
- Ensure that Node.js and npm are installed on your system.
- Check for compatibility issues with your current React version.
- If styles are not applied, verify that stylesheets are correctly imported in your project.
- If components are not rendering, ensure that the correct components are imported and used.
For more insights, updates, or to collaborate on AI development projects, stay connected with fxis.ai.
At fxis.ai, we believe that such advancements are crucial for the future of AI, as they enable more comprehensive and effective solutions. Our team is continually exploring new methodologies to push the envelope in artificial intelligence, ensuring that our clients benefit from the latest technological innovations.