open-index/open-npm huggingface dataset:
npm package: @ice/plugin-fusion
Description: plugin for ICE while use fusion component
Latest version: 1.1.0

# @ice/plugin-fusion

ice.js plugin for using fusion components.

## Usage

```js
import { defineConfig } from '@ice/app';
import fusion from '@ice/plugin-fusion';

export default defineConfig(() => ({
  plugins: [fusion({
    importStyle: true,
    themePackage: '@alifd/theme-design-pro',
    theme: {
      'primary-color': '#fff',
    },
  })],
}));
```

## Options

- importStyle: Fusion component styles will be automatically imported after enabling.
- themePackage: Fusion component theme package configuration, if set to an array, multi-theme capability is enabled.
- theme: theme configuration, overwrite existing themes by setting sass variables.
npm package: @ice/plugin-icestark
Description: Easy use `icestark` in icejs.
Author: ice-admin@alibaba-inc.com
Latest version: 1.2.1

# plugin-icestark

> Easy use [`icestark`](https://github.com/ice-lab/icestark) in [icejs](https://github.com/alibaba/ice).

## Usage

### Install

```bash
npm i -D @ice/plugin-icestark
```

### Framework Application

Configurate plugin to your `ice.config.mts`:

```ts title="ice.config.mts"
import { defineConfig } from '@ice/app';
import icestark from '@ice/plugin-icestark';

export default defineConfig(() => ({
  plugins: [
    icestark({ type: 'framework' }),
  ],
}));
```

Through export `icestark` configuration of your framework application.

```ts title="src/app.ts"
import { defineFrameworkConfig } from '@ice/plugin-icestark/esm/types';

export const icestark = defineFrameworkConfig(() => ({
  getApps: () => ([]),
}));
```

**Options:**
 - `getApps`: get sub-application information, support async function
 - `appRouter`
   - `ErrorComponent`: error component
   - `LoadingComponent`: loading component
   - `NotFoundComponent`: 404 not found component
   - `shouldAssetsRemove`: check assets if it should be removed
 - `layout`: specify Framework application Layout

### Sub-application

Configurate plugin to your `ice.config.mts`:

```ts title="ice.config.mts"
import { defineConfig } from '@ice/app';
import icestark from '@ice/plugin-icestark';

export default defineConfig(() => ({
  plugins: [
    icestark({ type: 'child' }),
  ],
}));
```

modify `icestark` exports in `src/app.ts`:

```ts title="src/app.ts"
// app.ts
import { defineChildConfig } from '@ice/plugin-icestark/esm/types';

export const icestark = defineChildConfig(() => ({
  mount: () => {},
  unmount: () => {},
}));
```

**Options:**
 - `mount`: excute before Sub-application mounted
 - `unmount`: excute after Sub-application unmounted
npm package: @ice/plugin-jsx-plus
Description: JSX Plus support for ice.js
Latest version: 1.0.4

# @ice/plugin-jsx-plus

This plugin adds support for JSX+ syntax to the ice.js.

## Definition of JSX Plus

https://github.com/jsx-plus/jsx-plus

## Usage

```js
import { defineConfig } from '@ice/app';
import jsxplus from '@ice/plugin-jsx-plus';

export default defineConfig(() => ({
  plugins: [
    jsxplus({
      // options
    }),
  ],
}));
```

## Options

- `include`: `(string | RegExp)[]`
  - Files to be included.
  - Default: the project `src` directory.
- `exclude`: `(string | RegExp)[]`
  - Files to be excluded.
  - Default: `[]`
- `extensions`: `string[]`
  - File extensions to be processed.
  - Default: `['.jsx', '.tsx']`

> If `include` and `exclude` are both set, `exclude` will be priority executed.
npm package: @ice/plugin-moment-locales
Description: ice.js plugin for reduce moment locale size.
Latest version: 1.0.2

# @ice/plugin-moment-locales

ice.js Plugin for load moment locales and reduce size of moment.

## Usage

```js
import { defineConfig } from '@ice/app';
import moment from '@ice/plugin-moment-locales';

export default defineConfig(() => ({
  plugins: [
    moment({
      locales: ['zh-CN'],
    }),
  ],
}));
```
npm package: @ice/plugin-pha
Description: ice.js plugin for PHA.
Latest version: 3.0.4

# @ice/plugin-pha

An ice.js plugin to enable PHA features.

## Usage

```js
import { defineConfig } from '@ice/app';
import pha from '@ice/plugin-pha';

export default defineConfig(() => ({
  plugins: [pha()],
}));
```
npm package: @ice/plugin-request
Description: Request plugin for ice.
Latest version: 1.0.3

# @ice/plugin-request

Provides a unified request method for ice.js projects.

## Usage

```bash
$ npm i @ice/plugin-request -S
```

Add plugin.

```js title="ice.config.mts"
import { defineConfig } from '@ice/app';
import request from '@ice/plugin-request';

export default defineConfig(() => ({
  plugins: [
    request(),
  ],
}));
```

## API

### request

```js title="service.ts"
import { request } from 'ice';

export async function getUser(id) {
  return await request(`/api/user/${id}`);
}
```

### useRequest

```js title="home.tsx"
import { useEffect } from 'react';
import { useRequest } from 'ice';

export default function Home() {
  const {
    data,
    error,
    loading,
    request
  } = useRequest(service.getUser);

  useEffect(() => {
    request();
  }, []);

  if (error) {
    return <div>failed to load</div>;
  }
  if (!data || loading) {
    return <div>loading...</div>;
  }
  return (
    <h2 className={styles.title}>
      Name: {data.name} Age: {data.age}
    </h2>
  );
}
```
npm package: @ice/plugin-store
Description: A plugin of state management base on Redux and React Redux used in ice.js`.
Latest version: 1.1.2

# @ice/plugin-store

A plugin of state management base on Redux and React Redux used in ice.js`.

## Usage

```ts
import { defineConfig } from '@ice/app';
import store from '@ice/plugin-store';

export default defineConfig(() => ({
  plugins: [
    store(),
  ],
}));
```

## Options

- `disableResetPageState` 
  - The default value is `false`.
  - After it is turned on, the page state will not be reinitialized after switching the page and entering the original page again.
npm package: @ice/plugin-unocss
Description: A plugin for enable unocss in your app based on `@ice/app`
Latest version: 1.1.0

# @ice/plugin-unocss

A plugin for enable unocss in your app based on `@ice/app`.


## Usage

Install `@ice/plugin-unocss`:

```bash
$ npm install @ice/plugin-unocss --save-dev
```

Configure it in `ice.config.mts`:

```ts
import { defineConfig } from '@ice/app';
import Unocss from '@ice/plugin-unocss';

export default defineConfig(() => ({
  plugins: [
    Unocss(),
  ]
}));
```

## Plugin Options

Plugin options is as same as [UnoCSS ConfigFle](https://unocss.dev/guide/config-file).

Plugin has a default preset `@unocss/preset-uno` for UnoCSS. You can pass options of presets to override the default preset:

```ts
import { defineConfig } from '@ice/app';
import Unocss from '@ice/plugin-unocss';
import {
  defineConfig,
  presetAttributify,
  presetIcons,
  presetTypography,
  presetUno,
  presetWebFonts,
  transformerDirectives,
  transformerVariantGroup
} from 'unocss';

export default defineConfig(() => ({
  plugins: [
    Unocss({
      shortcuts: [
        // ...
      ],
      theme: {
        colors: {
          // ...
        }
      },
      presets: [
        presetUno(),
        presetAttributify(),
        presetIcons(),
        presetTypography(),
        presetWebFonts({
          fonts: {
            // ...
          },
        }),
      ],
      transformers: [
        transformerDirectives(),
        transformerVariantGroup(),
      ],
    }),
  ],
}));
```
npm package: @ice/remark-react-docgen-docusaurus
Description: A remark plugin to generate react components doc with docusaurus.
Latest version: 1.0.1

# @ice/remark-react-docgen-docusaurus

A remark plugin(based on [react-docgen](https://github.com/reactjs/react-docgen/tree/5.x)) to automatic generate react component docs in [Docusaurus](https://docusaurus.io/) or [ICE PKG](http://pkg.ice.work/)

## Install

```bash
$ npm i @ice/remark-react-docgen-docusaurus --save-dev
```

## Usage

First, we need to add the plugin to the config:

If you use it in Docusaurus, add the plugin to the `docusaurus.config.js`:

```js
// docusaurus.config.js
const remarkReactDocgen = require('@ice/remark-react-docgen-docusaurus');

module.exports = {
  presets: [
    [
      '@docusaurus/preset-classic',
      {
        docs: {
          remarkPlugins: [remarkReactDocgen],
        },
      },
    ],
  ],
}
```

If you use it in ICE PKG, add the plugin to the `build.config.mts`:

```ts
// build.config.mts
import { defineConfig } from '@ice/pkg';

export default defineConfig({
  plugins: [
    [
      '@ice/pkg-plugin-docusaurus',
      {
        remarkPlugins: [
          "require('@ice/remark-react-docgen-docusaurus')",
        ],
      },
    ],
  ],
});
```

Add the `<ReactDocgenProps />` component to the markdown:

```md
## API

<ReactDocgenProps path="../src/components/Button/index.tsx"></ReactDocgenProps>
```

> the path is the path of the React component

Finally, you can run the command `npm run start`, you can see the following:

<img width="771" alt="image" src="https://user-images.githubusercontent.com/44047106/228744573-e52c7a0f-4327-4b46-8c03-bcd4cb1a4934.png">