Emooa UI

An enterprise-class UI design language and React UI library.

✨ Features

• 🛡 Written in TypeScript with predictable static types.
• ⚙️ Whole package of design resources and development tools.

🖥 Environment Support

• Modern browsers
• Electron

Chrome	Edge	Firefox	Safari	Electron
51+	15+	55+	12.1+	last 2 versions

Installation

npm install @emooa/ui
// or
yarn add @emooa/ui

Usage

Simple example

import { Button, GeoJSON, Image, Space } from "@emooa/ui";

export default () => (
  <>
    <Space>
      <Button type="primary">Primary Button<Button/>
      <Button>Secondary Button<Button/>
    <Space/>
    <Image url="https://api.emooa.com/aimg" />
    <GeoJSON
      data={{
        type: 'Feature',
        geometry: {
          type: 'LineString',
          coordinates: [
            [102.0, 0.0],
            [103.0, 1.0],
            [104.0, 0.0],
            [105.0, 1.0],
          ],
          properties: {
            strokeStyle: 'green',
          },
        },
        properties: {
          name: '线',
        },
      }}
    />
  </>
);

Components

At present, common components such as Button, Icon, Image, GeoJSON, and Space have been implemented, and are being gradually added. For details, see [Emooa UI Components] (https://docs.emooa.com/ui ).

License

MIT Licensed
Copyright (c) 2023 Emooa

Q&A

• Failed to parse source map.

  • WARNING in ./node_modules/@emooa/ui/lib/image/index.js

    Module Warning (from ./node_modules/source-map-loader/dist/cjs.js):

    Failed to parse source map from '/xxx/node_modules/@emooa/ui/src/image/index.tsx' file: Error: ENOENT: no such file or directory, open '/xxx/node_modules/@emooa/ui/src/image/index.tsx'

  • Actually, CRA with Webpack 5.x cause it. They are working on resolving. https://github.com/facebook/create-react-app/pull/11752

  • You can remove the warning by adding GENERATE_SOURCEMAP=false to your .env file. Read More

    "scripts": {
      "start": "GENERATE_SOURCEMAP=false && react-scripts start",
    }