open-index/open-npm huggingface dataset:
npm package: @feutopia/vue-echarts
Description: Vue3 Echarts
Author: David Zheng
Latest version: 0.0.2

# @feutopia/vue-echarts

**中文** | [English](./README.md)

基于 Apache ECharts 的 Vue.js 图表组件库。

## 特性

- 📦 开箱即用的图表组件
- 🎨 基于 Apache ECharts
- 💪 使用 TypeScript 编写
- 🔧 高度可定制
- 🚀 轻量且高效

## 安装

```bash
pnpm install @feutopia/vue-echarts
```

## 使用

### 基础用法

```vue
<script setup lang="ts">
import { ref } from "vue";
import { LineChart } from "@feutopia/vue-echarts";
import type { EChartsOption } from "@feutopia/vue-echarts";
const option = ref<EChartsOption>({
  title: {
    text: "折线图",
  },
  xAxis: {
    type: "category",
    data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日']
  },
  yAxis: {
    type: "value",
  },
  series: [
    {
      data: [150, 230, 224, 218, 135, 147, 260],
      type: "line",
    },
  ],
});
</script>
<template>
  <LineChart :option="option" class="chart" />
</template>
<style scoped>
.chart {
  height: 400px;
}
</style>
```

### 可用组件

- `LineChart`: 折线图
- `BarChart`: 柱状图
- `PieChart`: 饼图

## 属性

| 名称 | 类型 | 默认值 | 说明 |
|------|------|--------|------|
| option | `EChartsOption` | - | ECharts 的配置对象 |

## 方法

每个图表组件通过 ref 暴露以下方法：

| 方法 | 说明 |
|------|------|
| getInstance | 返回 ECharts 实例 |

## 许可证

[MIT](./LICENSE)
npm package: @feutopia/vue-ui
Description: Vue3 UI Components Library
Author: David Zheng
Latest version: 0.0.24

# Vue UI 组件库

**中文** | [English](./README.md)

一个现代化的 Vue 3 UI 组件库，支持 TypeScript。

## 特性

- 🚀 使用 Vue 3 Composition API
- 💪 基于 TypeScript 开发
- 📦 支持 Tree-shaking
- 🔧 简单易用
- ⚡️ 轻量且高性能
- 🧪 完善的测试覆盖
- 📚 详尽的文档说明

## 安装

```bash
pnpm add @feutopia/vue-ui
```

## 使用

### 虚拟滚动组件

``` vue
<script setup lang="ts">
import { InfiniteList } from "@feutopia/vue-ui";

const items = Array.from({ length: 1000 }, (_, index) => ({
  uid: index,
  value: `项目 ${index + 1}`,
}));
</script>

<template>
  <InfiniteList :items="items" :itemSize="50">
    <template #default="{ item }">
      <div>{{ item.value }}</div>
    </template>
		<template #extra>
      <div>这里是额外内容</div>
    </template>
  </InfiniteList>
</template>
```

### Tabs 组件

```vue
<script setup lang="ts">
import { Tabs, TabPane } from "@feutopia/vue-ui";
</script>

<template>
	<Tabs>
		<TabPane name="1" label="Tab 1">Content of tab 1</TabPane>
		<TabPane name="2" label="Tab 2">Content of tab 2</TabPane>
	</Tabs>
</template>
```
npm package: @feux/storybook-addon-bit
Description: Integrate component versions info from Bit
Author: Mikael Colliander
Latest version: 1.1.8

# Storybook Bit Addon

## What it does
For projects utilizing both Storybook and Bit, this addon brings Bit component data into Storybook. Using this addon will integrate the following information regarding a component, into Storybook:

* Available version tags
* Installation strings
* Source code
* Dependencies

## Demo
Follow this link to a Storybook using the addon. Activate the 'Bit Versions' tab:
https://stsjdesigndevsalesweu.z6.web.core.windows.net/next/index.html?path=/changelog/components-accordion--default-accordion

## Limitations
* Change logs for components are not included since they are not available in the response provided by the api (https://node.bit.dev)
* This addon will not render different component versions in Storybook.

## Prerequisits
* @storybook/react project
* Components hosted with Bit (typically a scope on bit.cloud)
* A server to proxy api-calls towards https://node.bit.dev/[org].[scope]

## Server Api requirements
To be able to display data from https://node.bit.dev you need a server to proxy api calls. For this addon the following routes need to be configured:

* https://[your.domain]/component/{component-id}
* https://[your.domain]/tarball/{component-id}/{version}

The addon requires these routes to return data regarding a specific component that you have hosted on bit.cloud.

The component route must return json data modelled the same way as
https://node.bit.dev/[org].[scope].{component-id}

The tarball route must return the Gunzipped contents of a components tarball:
https://node.bit.dev/@bit/[org].[scope].{component-id}/-/@bit-[org].[scope].{component-id}-{version}.tgz

This addon requires the .tgz to be unzipped on the server and the contens to be returned from the tarball route. Here's an example of how that woul look:
https://sjdesignsystembff.azurewebsites.net/tarball/ui.accordion/2.0.1

## How to implement this addon
Register the addon in .storybook/main.js:

```
module.exports = {
  ...
  "addons": [
    ...
    "@feux/storybook-addon-bit"
  ],
  ...
}
```

In your .storybook/preview.js, add a parameters variable if one does not exist already and add a bit paremeter to it, to be able to retrieve Bit component data via your server:

```
export const parameters = {
  ...
  bit: {
    apiUrl: "https://path.to.your.server/",
  }
  ...
}
```

Then in your stories add an object named parameters (if one does not exist already) to the storys' metadata object (the storys' default export) then add bit to parameters:

```
export default {
  ...
  parameters: {
    ...
    bit: {
      componentId: 'ui/button',
    },
    ...
  },
  ...
};
```
npm package: @fev/easy-config-mock
Description: easy mock data with easy config, support customize middleware
Author: fujuewen
Latest version: 1.0.3

# easy-config-mock
[中文readme](https://github.com/nwa2018/easy-config-mock/blob/master/README-ZH.md)

easy mock data with easy config, `support customize middleware`. And it's easy integrated to your cli or workflow, what you have to do is just to `write some config`, and it can be `reload automatic`

> you can see a demo in the demo directory, please update your node to the 8.x version to run the demo

### install
--------
```
npm i easy-config-mock
or
yarn add easy-config-mock
```

### use
--------
``` javascript
const path = require('path')
const easyConfigMock = require('easy-config-mock')

new easyConfigMock({
  // just pass config file path to easyConfigMock, the server will watch this file and reload dynamic
  path: path.resolve(__dirname, 'xxxx.js')
})
```
`the config file example:`
``` javascript
// xxxx.js
module.exports = {
  // the common options is not neccessary, the default config is at bellow
  common: {
    // mock server default port, you can change the port, if the port is used, it will be changed automatic
    port: 8018,
    // maybe you want to see the ajax loading effect, you can set the request delay
    timeout: 500,
    // maybe you want to see what happen when the request fail, you can set the rate to 0, rate range between 0~1, mean the success rate
    rate: 1,
    // set false to stop the mock server
    mock: true
  },
  // api...
  '/pkApi/getList': {
    code: 0,
    'data|5': [{
      'uid|1000-99999': 999,
      'name': '@cname'
    }],
    result: true
  },
  '/pkApi/getPerson': {
    code: 0,
    'data|5': [{
      'name': '@cname'
    }],
    result: true
  },
  '/pkApi/getOther': {
    code: 0,
    'data|5': [{
      'name': '@cname'
    }],
    result: true
  }
}
```
open `http://127.0.0.1:8018/pkApi/getPerson` to see the mock data

### Q&A
--------
##### 1 how to mock jsonp
just pass the `callback` param in the request url
##### 2 how to mock data
you can reference the [mock rule](http://mockjs.com/examples.html)
##### 3 how to suit complex situation, I want to customize the response
please see the below demo, `api` can be object and can be function too, the function is a standard express middleware, you can write your logic, and `don't forget to mount your response in req.myData`
``` javascript
module.exports = {
  ...
  ['/pkApi/getOther'] (req, res, next) {
    const id = req.query.id
    req.myData = {   // this is important! mount your response in req.myData
      0: {
        code: 0,
        'test|1-100': 100
      },
      1: {
        code: 1,
        'number|+1': 202
      },
      2:{
        code: 2,
        'name': '@cname'
      },
      ...
    }[id]
    next()  // don't forget to call next in the last
  }
  ...
}
```
you can obtain the param in `req.query` in `get` request, and you can obtain the param in `req.body` in `post` request

### issues
-----------
feel free to open an issue when you encounter problems, [issue list](https://github.com/nwa2018/easy-config-mock/issues)
npm package: @fev/easy-mock
Description: easy mock data with easy config, support customize middleware
Author: fujuewen
Latest version: 0.1.3

# @fev/easy-mock

`easy-mock`只需一些简单的配置就可以轻松`mock`数据

### 安装
--------
```
npm i @fev/easy-mock
or
yarn add @fev/easy-mock
```

### 使用
--------
``` javascript
const path = require('path')
const easyMock = require('@fev/easy-mock')

new easyMock({
  // 请传递完整的配置文件路径进去，服务是会自动刷新
  path: path.resolve(__dirname, 'xxxx.js')
})
```
`配置文件的例子`
``` javascript
// xxxx.js
module.exports = {
  // common选项不是必须, 内置的配置如下，当然你也可以更改
  common: {
    // mock服务的默认端口，如果端口被占用，会换一个
    port: 8018,
    // 如果你想看一下ajax的loading效果，该配置项可以设置接口的返回延迟
    timeout: 500,
    // 如果你想看一下接口请求失败的效果，将rate设置成0就可以了，rate取值范围0~1，代表成功的概率
    rate: 1,
    // mock属性为false的话可以关闭掉mock服务
    mock: true,
    // 是否打印调试信息
    debug: false
  },
  // api...，可以不用写全，写最后一个就好
  'getList': {
    code: 0,
    'data|5': [{
      'uid|1000-99999': 999,
      'name': '@cname'
    }],
    result: true
  },
  '/pkApi/getPerson': {
    code: 0,
    'data|5': [{
      'name': '@cname'
    }],
    result: true
  },
  '/pkApi/getOther': {
    code: 0,
    'data|5': [{
      'name': '@cname'
    }],
    result: true
  }
}
```
服务启动后，打开`http://127.0.0.1:8018/pkApi/getPerson`就可以看到mock的数据了！

### 本地debug
```
npm i @fev/fev -g
npm i nodemon -g

npm run dev
```

### 发布
```
npm i standard-version -g
npm run pub
```

### Q&A
--------
##### 1 怎么去mock jsonp
在链接后面传`callback`参数就好了
##### 2 怎么去mock数据
参考[mock rule](http://mockjs.com/examples.html)
##### 3 怎么去处理更复杂的场景，我想要自定义数据返回
``` javascript
module.exports = {
  ...
  ['/pkApi/getOther'] (req, res) {
    const query = req.query
    // 可以自己写处理逻辑
    return {}
  }
  ...
}
```
`get`类型的请求可以通过`req.query`去获取参数

`post`类型的请求可以通过`req.body`去获取参数

### issues
-----------
[issue list](http://gitlab.levii.cn/fev/easy-mock/issues)

### changelog

[changelog](./CHANGELOG.md)
npm package: @fev/fev
Description: [使用文档](http://fev.levii.art/fev/#/)
Author: fujuewen
Latest version: 0.1.10

# 说明

[使用文档](http://fev.levii.art/fev/#/)

### 发布指南

- 先提交代码，规范请参考阮一峰的文章[Commit message 和 Change log 编写指南](http://www.ruanyifeng.com/blog/2016/01/commit_message_change_log.html)

- npm run pub
npm package: @fevirabao/avue
Description: A Magic Configurable Web Framework
Author: smallwei
Latest version: 2.9.0

<p align="center"><a href="https://avuejs.com" target="_blank" rel="noopener noreferrer"><img width="100" src="https://avuejs.com/images/logo-bg.jpg" alt="Avue logo"></a></p>

## 介绍
  Avue.js是基于现有的element-ui库进行的二次封装，从而简化一些繁琐的操作，核心理念为数据驱动视图,主要的组件库针对table表格和form表单场景，同时衍生出更多企业常用的组件，达到高复用，容易维护和扩展的框架，同时内置了丰富了数据展示组件，让开发变得更加容易.

### 浏览器兼容性
  支持所有符合ES5标准的浏览器(不支持IE8及以下版本）.
  
## 文件

| 文件名 | 用途 |
|-------------|----------|
| avue.min.js | 生产环境|
| avue.js     | 开发环境|

## 文档

要查看[Live Examples](https://avuejs.com/doc/installation)和文档，请访问[https://avuejs.com](https://avuejs.com).

## 问答

有关问题和支持，请使用[issues](https://gitee.com/smallweigit/avue/issues)或加入QQ群606410437.

## issues

打开问题之前，请务必提供详细的问题过程和截图，不符合准则的问题将会被拒绝.

## Changelog

[发行说明](https://gitee.com/smallweigit/avue/releases)中记录了每个版本的详细更改。

## License

[MIT](http://opensource.org/licenses/MIT)

Copyright (c) 2017-present, Smallwei
npm package: @fevo-tech/graphql-codegen-cli
Description: <p align="center">     <img src="https://github.com/dotansimha/graphql-code-generator/blob/master/logo.png?raw=true" /> </p>
Author: Dotan Simha
Latest version: 1.15.4

# GraphQL Code Generator

<p align="center">
    <img src="https://github.com/dotansimha/graphql-code-generator/blob/master/logo.png?raw=true" />
</p>

Live demo and full documentation: [graphql-code-generator.com](https://graphql-code-generator.com)

Project repository: [graphql-code-generator](https://github.com/dotansimha/graphql-code-generator)