open-index/open-npm huggingface dataset:
npm package: @fe6/tpl-flutter
Description: flutter project template
Author: 李梦龙
Latest version: 0.3.0

# tpl-flutter

> flutter 项目模板

## 集成

- 全局环境变量，可分环境启动
- 启动图的配置，直接替换图
- icon 的配置，直接替换即可
- 状态管理的简单使用
- 网络请求的简单封装
- 路由的简单封装

[更新记录](https://github.com/fe6/cli/blob/master/packages/tpl-flutter/CHANGELOG.md)
npm package: @fe6/tpl-vue2-js
Description: version project of vue2
Author: 李梦龙
Latest version: 0.3.0

# tpl-vue2-js

> VueJs 2.x 的项目模板

## 集成

- axios 的二次封装
- 组件的自动注册
- 接口的自动导入 `src/apis` 中，命名格式遵循 `/\.apis\.js$/`
- 路由的自动导入
- 环境变量的简单配置
- 语法规范的封装
- git commit 信息的管理

[更新记录](https://github.com/fe6/cli/blob/master/packages/tpl-vue2-js/CHANGELOG.md)
npm package: @fe6/water-loader
Description: 更快的书写 Water 标签，更好的规范编码
Author: 李梦龙
Latest version: 0.1.0

# water-loader
> 统一的 Water 标签编写规范

[![@fe6/water-loader](https://img.shields.io/npm/v/@fe6/water-loader.svg?style=flat-square)](https://www.npmjs.org/package/@fe6/water-loader)
[![code style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg)](https://github.com/prettier/prettier)

## 预览

可进入 `./demo/` 文件夹，安装以来之后，执行 `npm start` ，进行查看。

##### 若 `Button` 转译成 `w-button`

不需要加参数，效果如下

1. 转译前：

![Button](./img/loader1.png)

2. 转移后：

![w-button](./img/loader3.png)

##### 若 `w-button` 转译成 `Button`

需要在 `./demo/webpack.config.js` 中加 `prefix: true` ，效果如下

1. 转译前：

![Button](./img/loader2.png)

2. 转移后：

![w-button](./img/loader4.png)
npm package: @fe9527/i18n-helper
Description: ## install ```bash npm i @fe9527/i18n-helper -D ```
Author: hans
Latest version: 1.4.1

# i18n-helper

## install
```bash
npm i @fe9527/i18n-helper -D
```

## 功能
### i18nDownload
下载国际化平台的翻译文件
#### usage

创建一个 js 文件，参考下边的代码

```js
import path from 'node:path'
import { fileURLToPath } from 'node:url'
import { i18nDownload } from '@fe9527/i18n-helper'

const __filename = fileURLToPath(import.meta.url) // get the resolved path to the file
const __dirname = path.dirname(__filename) // get the name of the directory
const dirPath = path.join(__dirname, '../src/lang/json')
// 第一个参数为项目名称（在国际化平台中的名称），第二个参数为翻译文件存放路径
i18nDownload('star-ib', dirPath)
```

在 package.json 中添加一个 script，执行这个 js 文件

```json
{
  "scripts": {
    "gen:i18n": "node ./scripts/i18n.mjs"
  }
}
```

### data2Excel
通过传入的数据转换为 excel 文件
#### usage

创建一个 js 文件，参考下边的代码
```js
import path from 'node:path'
import { fileURLToPath } from 'node:url'
import { data2Excel, readModules } from '@fe9527/i18n-helper'

const __filename = fileURLToPath(import.meta.url) // get the resolved path to the file
const __dirname = path.dirname(__filename) // get the name of the directory
const dirPath = path.join(__dirname, '../src/lang/au')

readModules(dirPath).then((data) => {
  data2Excel(data)
})
```

在 package.json 中添加一个 script，执行这个 js 文件

```json
{
  "scripts": {
    "gen:i18n-excel": "esno ./scripts/gen-i18n-excel.js"
  }
}
```
> 注意：`readModules` 读取的是js文件，且是通过 `export default` 导出的对象
> 如果是其他格式，请自行导入数据，只使用 `data2Excel` 进行转换
npm package: @fe9527/tool
Description: ## 安装
Author: Hans
Latest version: 1.1.0

# @fe9527/tool

## 安装

```bash
$ pnpm install @fe9527/tool
```

### 已有方法

|         工具名          |              描述              |
|:--------------------:|:----------------------------:|
|          getDeviceInfo          | 对 `navigator.userAgent` 进行解析, 获取访问的设备信息 |


### getDeviceInfo 示例

```js
import { getDeviceInfo } from '@fe9527/tool'

// BrowserEnum: 浏览器名字枚举
// DeviceTypeEnum 设备类型枚举
// EngineTypeEnum 浏览器内核枚举
// OSTypeEnum ： 操作系统枚举
// DeviceInfo： getDeviceInfo() 返回结果的类型

console.log(getDeviceInfo())
// console.log(ua('Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/96.0.4664.93 Safari/537.36'))
// {
//   "browser": "Chrome",
//   "browserZH": "Chrome",
//   "browserVersion": "96.0.4664.93",
//   "os": "Macintosh",
//   "osVersion": "10.15.7",
//   "device": "PC",
//   "engine": "WebKit"
// }
```
npm package: @fe_korey/resume
Description: 赵柯宇的web前端工程师简历
Author: Korey
Latest version: 4.0.0

<h2 align="center"><a href='https://www.flqin.com' target='_blank'>✏️✏️front-end engineer resume</a></h2>
<p align="center">
  <a href='https://github.com/zhaoky/flqin'><img src='https://img.shields.io/github/last-commit/zhaoky/flqin' alt='GitHub last commit' /></a>
  <a href="https://www.npmjs.com/package/@fe_korey/resume"><img src="https://img.shields.io/npm/dm/@fe_korey/resume.svg" alt="Downloads"></a>
  <a href="https://github.com/zhaoky/flqin/actions"><img src="https://github.com/zhaoky/flqin/workflows/Action CI/badge.svg" alt="Actions Status"></a>
  <a href='https://www.npmjs.com/package/@fe_korey/resume'><img src='https://img.shields.io/npm/l/@fe_korey/resume' alt='NPM' /></a>
  <a href='https://www.npmjs.com/package/@fe_korey/resume'><img src='https://img.shields.io/npm/v/@fe_korey/resume' alt='npm (scoped)' /></a>
</p>

English | [中文](./README_CN.MD)

#### Baidu search: [web Front-end engineer resume](https://www.baidu.com/s?ie=UTF-8&wd=web%E5%89%8D%E7%AB%AF%E5%B7%A5%E7%A8%8B%E5%B8%88%E7%AE%80%E5%8E%86)

![web前端工程师简历截图](https://raw.githubusercontent.com/zhaoky/flqin/master/src/assets/web.jpg)

## MISC

Many friends email me to learn how to make such a resume. In fact, you only need to fork the project and try to run the project!

Because the MVVM framework is numerous and constantly updated, For the purpose of learning, and finally chose to implement [an MVVM framework](https://github.com/zhaoky/mvvm) to serve this project.

In order to 'SEO' and beginner learning, a [pure static page](https://resume.flqin.com) and a [Chinese-English page](<(https://flqin.com/resume)) based on [MVVM].

Please [click here](https://github.com/zhaoky/flqin/issues) if you have any questions or suggestions.Learn from each other and make progress together!

Please click star if you like, thank you! 💕💕

## Start

1. clone

```bash
git clone https://github.com/zhaoky/flqin.git
```

2. change directory

```bash
cd flqin
```

3. install dependencies

```bash
yarn
```

4. serve with hot reload

```bash
yarn run dev:seo // seo 版纯静态页
yarn run dev // mvvm 中英双版页
```

Debug address： `http://0.0.0.0:8080/`

5. build for production with minification

```bash
yarn run build:seo // seo 版纯静态页
yarn run build // mvvm 中英双版页
```

6. build for production with analyze

```bash
yarn run analyze:seo // seo 版纯静态页
yarn run analyze // mvvm 中英双版页
```

7. check code and fix

```bash
yarn run lint // 检查
yarn run fix // 修复
```

## Technical support

### [@korey/MVVM](https://github.com/zhaoky/mvvm)

A simple MVVM framework that currently implements data-binding and view-refresh functionality, is constantly optimizing and updating, and welcomes learning exchanges.

### [@korey/Fullpage](https://github.com/zhaoky/fullpage)

A simple Fullpage framework, which currently implements full-screen page-turning with pull-up, scrolling, and anchor-pointing, is still being optimized and updated. Welcome to learn and communicate.

## License

[MIT](./LICENSE)
npm package: @feaas/vue-webcomponent
Description: Lightweight Web Component Boilerplate for VueJS
Author: Stephan Bitomsky
Latest version: 1.0.0

# @feaas/vue-webcomponents

Lightweight Web Component Boilerplate for VueJS

Share your Vue Components with ease and consume them direct in the browser.

## Motivation

- Keep things simple
- Use only really necessary dependencies
- Export UMD bundle for direct execution in the browser

## Dependencies

- `rollup` - One of the best bundler:-) flexible, fast, lightweight and slim outputs
- `rollup-plugin-vue` - Rollup Plugin for VueJS
- `@rollup/plugin-node-resolve` - node modules path resolver
- `vue` - VueJS itself
- `vue-template-compiler` - Template Compiler for Vue 2
- `@vue/web-component-wrapper` - Wrap a vue component as a web component
npm package: @feanor08/retro-ui
Description: Collection Of Retro UI Components. Currently working on NES components. 
Author: feanor08
Latest version: 1.6.9

# Retro UI
#####A Retro UI Collection
```
╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱
╱╱╱╭━━━╮╱╱╱╱╱╭╮╱╱╱╱╱╱╱╱╱╭╮╱╭╮╭━━╮╱╱╱╱╱╱╱╱╱╱╱╭━╮╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╭━━━╮╭━━━╮╱╱╱
╱╱╱┃╭━╮┃╱╱╱╱╭╯╰╮╱╱╱╱╱╱╱╱┃┃╱┃┃╰┫┣╯╱╱╱╱╱╱╱╱╱╱╱┃╭╯╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱┃╭━╮┃┃╭━╮┃╱╱╱
╱╱╱┃╰━╯┃╭━━╮╰╮╭╯╭━╮╭━━╮╱┃┃╱┃┃╱┃┃╱╱╱╭╮╱╱╱╱╱╱╭╯╰╮╭━━╮╭━━╮╭━╮╱╭━━╮╭━╮┃┃┃┃┃┃╰━╯┃╱╱╱
╱╱╱┃╭╮╭╯┃┃━┫╱┃┃╱┃╭╯┃╭╮┃╱┃┃╱┃┃╱┃┃╱╱╱┃╰╮╭┳╮╱╱╰╮╭╯┃┃━┫┃╭╮┃┃╭╮╮┃╭╮┃┃╭╯┃┃┃┃┃┃╭━╮┃╱╱╱
╱╱╱┃┃┃╰╮┃┃━┫╱┃╰╮┃┃╱┃╰╯┃╱┃╰━╯┃╭┫┣╮╱╱┃╋┃┃┃┃╱╱╱┃┃╱┃┃━┫┃╭╮┃┃┃┃┃┃╰╯┃┃┃╱┃╰━╯┃┃╰━╯┃╱╱╱
╱╱╱╰╯╰━╯╰━━╯╱╰━╯╰╯╱╰━━╯╱╰━━━╯╰━━╯╱╱╰━╯┣╮┃╱╱╱╰╯╱╰━━╯╰╯╰╯╰╯╰╯╰━━╯╰╯╱╰━━━╯╰━━━╯╱╱╱
╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╰━╯╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱
╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱╱

```
 ![license](https://img.shields.io/badge/license-MIT-green.svg)

****
###Installation
****

```npm
npm i @feanor08/retro-ui
```

```js
yarn add @feanor08/retro-ui
```
****
### UI Components
****
 ### **NES**
   + [NES Button](https://github.com/feanor08/retro-ui/blob/master/demo/docs/NESButton.md)   
     ![NESButton](./demo/images/nes-normal.gif)
   + [NES Container](https://github.com/feanor08/retro-ui/blob/master/demo/docs/NESContainer.md)
     ![NESContainer](./demo/images/nes-container-normal.png)
   + [NES Text](https://github.com/feanor08/retro-ui/blob/master/demo/docs/NESText.md)
npm package: @fear-io/horrorcloud-sdk
Description: Javascript package that help integrate FEAR NFT products into other websites
Author: Fear NFT
Latest version: 1.0.2

# Horror Cloud SDK ( by fear.io )

![npm](https://img.shields.io/npm/dw/@fear-io/horrorcloud-sdk)

### Introduction

Javascript package that help integrate FEAR NFT products into other websites

### Current Supported Products

- World Of Whack It

### Installation

You can install the SDK in 2 ways:

- via npm by running `npm install @fear-io/horrorcloud-sdk`
- via JS CDN by adding [bundle.js](https://cdn.jsdelivr.net/gh/fear-io/horrorcloud-sdk/dist/bundle.js) to your web page


### Referral Code

You need to get the **Referral Code** by going to https://whackit.co, login with your Google account then goto `Account > Affiliate` tab, press the copy button on the right of "Referral Code"

This document will assume your referral code is `TEST123`, please replace it with your.

### Integration using the SDK

Initialize the SDK by using: 

```javascript
const sdk = new HorrorCloudSDK('TEST123');
```

Plug the purchase/play game widget to your specified html element:

```javascript
sdk.play('world-of-whack-it', {
    style: {
        width: "100%",
        height: '900px',
    },
    containerId: 'horrorcloud-container-test',
});
```

`style` and `containerId` are optional.

If `containerId` is not supplied, new div with id `horrorcloud-container` will be appended to document.body of web page;

### Integration **without** using the SDK

In case it is hard to add an external JS script to your website, you can integrate World Of Whack It to your website without installing the SDK, by adding an iframe to `https://whackit.co/widget?partner=TEST123`

```html
<iframe allowfullscreen src="https://www.whackit.co/widget?partner=TEST123" style="width: 100%; height: 900px; border: none"></iframe>
```

### Example

[index.html](https://github.com/fear-io/horrorcloud-sdk/blob/main/index.html)
npm package: @fearcleari/wetable
Description: miniprogram, table
Author: fearclear
Latest version: 0.2.10

# @fearcleari/wetable

## 说明

- 使用[antd](https://github.com/ant-design/ant-design)的table样式库
- 用于小程序table展示

## 用法

1. 安装软件包

    ``` code
    npm i @fearcleari/wetable
    ```

2. 引用we-table

    ``` json
    index.json / app.json
    "usingComponents": {
      "we-table": "@fearcleari/wetable"
    }
    ```

3. 组件中书写对应的属性

    ``` html
    index.wxml
    <we-table
    scroll="{{scroll}}"
    columns="{{columns}}"
    dataSource="{{dataSource}}"
     >
     </we-table>
    ```

    ``` js
    index.js
    Page({
        data: {
            columns: [
                {dataIndex: 'name', title: 'Full Name', fixed: 'left', width: 100},
                {dataIndex: 'age', title: 'Age',width: 100},
                {dataIndex: 'address', title: 'Address'},
            ],
            scroll: {
                x: 750,
                y: 300
            },
            dataSource: [
                {name: 'Mike', age: 12, address: 'Nan.Street'},
                {name: 'Mike', age: 12, address: 'Nan.Street'},
                {name: 'Mike', age: 12, address: 'Nan.Street'},
                {name: 'Mike', age: 12, address: 'Nan.Street'}
            ]
        }
    })
    ```
npm package: @feargannicus/ngx-turnstile
Description: Angular component for Cloudflare Turnstile
Latest version: 16.0.1

# Cloudflare Turnstile Component for Angular

## ngx-turnstile

An easy to use component for implementing [Cloudflare Turnstile](https://blog.cloudflare.com/turnstile-private-captcha-alternative/) in Angular.

## Installation

Add this library to your Angular project using npm or yarn.

```bash
yarn add ngx-turnstile
npm install ngx-turnstile --save
```

## Quickstart

To start, import the TurnstileModule in your app module.

```typescript
// app.module.ts
import { TurnstileModule } from "ngx-turnstile";
import { BrowserModule } from "@angular/platform-browser";
import { MyApp } from "./app.component.ts";

@NgModule({
  bootstrap: [MyApp],
  declarations: [MyApp],
  imports: [BrowserModule, TurnstileModule],
})
export class MyAppModule {}
```

After that, you are free to use the component anywhere:

```typescript
// app.component.ts
import { Component } from "@angular/core";

@Component({
  selector: "my-app",
  template: `<ngx-turnstile
    [siteKey]="siteKey"
    (resolved)="sendCaptchaResponse($event)"
    theme="auto"
    [tabIndex]="0"
  ></ngx-turnstile>`,
})
export class MyApp {
  sendCaptchaResponse(captchaResponse: string) {
    console.log(`Resolved captcha with response: ${captchaResponse}`);
  }
}
```

## API

The component supports these options as input:

- `siteKey`
- `action`
- `cData`
- `theme`
- `tabIndex`

These options are well documented in the [Cloudflare Docs](https://developers.cloudflare.com/turnstile/get-started/client-side-rendering/#configurations). The letter cases are adapted to camelCase to facilitate easy migration from `ng-recaptcha`.

### Events

- `resolved(response: string)`. Occurs when the CAPTCHA resolution value changed.

### Example

For those who prefer examples over documentation, simply clone the repository and run

```bash
$ yarn install
$ ng build ngx-turnstile
$ ng serve ngx-turnstile-demo
```
npm package: @fearless/fearless
Description: ⚡️Small and Scary microframework
Author: Rodrigo Oler
Latest version: 0.1.1

# Fearless

⚡️microframework focused on productivity and performance so that developers can work less is to produce more without having risks in compromising performance

## 🎩 &nbsp; Features

- 🧘 **Zero config and easy.** Made to start and use.
- ⚡️ **Blazing Fast.** Support uWS(C++) where you have more performance.
- 🎛 **Pluggable.** With middlewares
- 🔐 **Typescript Support.** We have a full support for your type definitions.

## 🗃 &nbsp; Examples

<!--
- **[helloWorld](https://github.com/fearlessjs/examples/tree/master/examples/helloWorld/index.js)** - Some helloWorld example -->

## Install

#### yarn

```sh
yarn add @fearless/fearless
```

#### npm

```sh
npm install @fearless/fearless
```

## GET example

```js
const fearless = require("@fearless/fearless")
const { get, send } = require("@fearless/fearless")

const ping = get("/ping", (req, res) => send(res, 200, "ping =D!"))

fearless([ping])
```

## Async/Await example

```js
const fearless = require("@fearless/fearless")
const { get, send, sendAsync } = require("@fearless/fearless")

const helloWorld = get("/ping", (req, res) =>
  sendAsync(res, 200, async () => "Hello, World")
);

fearless([helloWorld])
```

## Body JSON with POST

```js
const fearless = require("@fearless/fearless")
const { post, sendAsync } = require("@fearless/fearless")
const json = require("@fearless/json")

const postExample = post("/", (req, res) => {
  sendAsync(res, 200, async () => {
    const data = await json(res)
    return data
  })
}

fearless([postExample])
```
npm package: @fearsomechicken/my-css-library
Description: First Css File
Author: Abhishek Manjhi
Latest version: 1.0.5

[text](https://www.npmjs.com/package/@fearsomechicken/my-css-library)

[text](https://unpkg.com/@fearsomechicken/my-css-library@1.0.0/styles.css)

using this in head "<link href="node_modules/@fearsomechicken/my-css-library/styles.css" rel="stylesheet">
" 

OR 

using "<link href="https://unpkg.com/@fearsomechicken/my-css-library@1.0.1/styles.css" rel="stylesheet">"