open-index/open-npm huggingface dataset:
npm package: @juxtacode/rollup-plugin-showprogress
Description: Rollup plugin to show a progress bar
Author: Joe Jorden
Latest version: 1.0.2

## @juxtacode/rollup-plugin-showprogress

Show current module being transpiled by the rollup bundler.

### Installation

```sh
npm i @juxtacode/rollup-plugin-showprogress --save-dev
```
```sh
yarn add -D @juxtacode/rollup-plugin-showprogress
```

### Usage

Include the following in the rollup config

#### Modern mode:

```js
import { rollup } from 'rollup';
import progressbar from '@juxtacode/rollup-plugin-showprogress';

rollup({
  entry: 'main.js',
  plugins: [
    progressbar(),
  ],
}).then(bundle => bundle.write({ dest: 'bundle.js', format: 'iife' }));
```

#### With custom settings:

```js
import { rollup } from 'rollup';
import progressbar from '@juxtacode/rollup-plugin-showprogress';

rollup({
  entry: 'main.js',
  plugins: [
    progressbar({
      modern: {
        format: '({value}/{total}): {file} {bar} {percentage}%', // default: 'Building... {bar} {percentage}% ({value}/{total}): {file}'
        preset: 'classic', // default: 'shades-grey'
      }
    }),
  ],
}).then(bundle => bundle.write({ dest: 'bundle.js', format: 'iife' }));
```

#### Legacy mode:

```js
import { rollup } from 'rollup';
import progressbar from '@juxtacode/rollup-plugin-showprogress';

rollup({
  entry: 'main.js',
  plugins: [
    progressbar({
      modern: false, // default: true
      clearLine: false, // default: true
    }),
  ],
}).then(bundle => bundle.write({ dest: 'bundle.js', format: 'iife' }));
```
npm package: @juyou/vue2react
Description: Transform Vue component to React component
Author: mcuking
Latest version: 0.0.4

# vue2react

A tool that transforms Vue component to React component.

Now support tranform SFC (.vue) file.

There are 2 ways to use the transform tool: web page or cli.

## Web Page

https://mcuking.github.io/vue2react/

To get better perfomance, suggest access to it via Chrome.

The demo screen is here.

<img src="./vue2react.png"/>

## CLI

#### Install

```bash
npm i vue2react -g
```

or

```bash
yarn add vue2react -g
```

#### Usage

bash example

```bash
vtr -i hello.vue -o ./screen -n nihao.js
vtr hello.vue ./screen nihao.js
vtr hello.vue
```

vtr help infomation

```bash
Usage: vtr [options]

Options:
  -V, --version  output the version number
  -i, --input    the input path for vue component
  -o, --output   the output path for react component, which default value is process.cwd()
  -n, --name     the output file name, which default value is "react.js"
  -h, --help     output usage information
```

## Support

- Data
  - [x] data
  - [x] props
  - [x] propsData
  - [x] computed
  - [x] methods
  - [ ] watch
- DOM
  - [ ] el
  - [x] template
  - [ ] render
  - [ ] renderError
- Lifecycle Hooks
  - [x] created
  - [x] mounted
  - [x] updated
  - [x] beforeDestroy
  - [x] errorCaptured
- Directives
  - [ ] v-text
  - [x] v-html
  - [x] v-show
  - [x] v-if
  - [ ] v-else
  - [ ] v-else-if
  - [x] v-for
  - [x] v-on / @
  - [x] v-bind / :
  - [ ] v-model
  - [ ] v-pre
  - [ ] v-cloak
  - [ ] v-once
- Special Attributes
  - [x] key
  - [x] ref

## Example

#### Demo1

<table>
  <tr>
    <td>
      Vue Code
    </td>
    <td>
      React Code
    </td>
  </tr>
  <tr>
    <td>
      <img src="./example/demo1/demo1_src.png"/>
    </td>
    <td>
      <img src="./example/demo1/demo1_dest.png"/>
    </td>
  </tr>
</table>

#### Demo2

<table>
  <tr>
    <td>
      Vue Code
    </td>
    <td>
      React Code
    </td>
  </tr>
  <tr>
    <td>
      <img src="./example/demo2/demo2_src.png"/>
    </td>
    <td>
      <img src="./example/demo2/demo2_dest.png"/>
    </td>
  </tr>
</table>

## Inspiration

[algorithm-visualizer](https://github.com/algorithm-visualizer/algorithm-visualizer)

[vue-to-react](https://github.com/dwqs/vue-to-react)
npm package: @juyren/stylelint-config-less
Description: 个人使用的stylelint配置
Author: juyren
Latest version: 2.0.3

# Stylelint Less 配置集合

本项目，将所有依赖都安装在`dependencies`中，做一个集合操作。
在正式开发的项目中，无需再次安装其他依赖，只需要安装该仓库即可

## 安装

```shell
  yarn add @juyren/stylelint-config-less -D

  npm install @juyren/stylelint-config-less -D
```

## 使用
```shell
  # .stylelintrc.js

  module.exports = {
    "extends": ["@juyren/stylelint-config-less"]
  }

  # .vscode --> settings.json
  {
      "stylelint.validate": ["less"],

      "editor.codeActionsOnSave": {
        "source.fixAll.stylelint": "explicit"
      }
  }
```

## 集成功能

1. 使用`stylelint-config-standard`，`stylelint-config-css-modules`规则
2. 自动排序 `stylelint-config-recess-order`
3. 忽略与 prettier 冲突的规则 `stylelint-config-prettier`
4. 检查可能存在冲突的属性值 `stylelint-declaration-block-no-ignored-properties`
5. 预设`rules`

## 注意

1. `postcss-less`在开发项目中，使用`yarn`会无法安装, 使用`npm`正常安装。如果使用`yarn`, 需要在开发项目中手动安装，版本需要跟本仓库一致 `^6.0.0`
npm package: @juzhenfe/scan-code
Description: A Vue.js project
Author: haojie hu
Latest version: 1.1.4

# juzhenfe-scan-code

> A Vue.js project

## Build Setup

``` bash
# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build
```

For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader).