open-index/open-npm huggingface dataset:
npm package: @ksky521/chobitsu
Description: Chrome devtools protocol JavaScript implementation
Author: redhoodsu
Latest version: 0.3.1

# chobitsu

[![NPM version][npm-image]][npm-url]
[![Build status][travis-image]][travis-url]
[![Test coverage][codecov-image]][codecov-url]
[![License][license-image]][npm-url]

[npm-image]: https://img.shields.io/npm/v/chobitsu?style=flat-square 
[npm-url]: https://npmjs.org/package/chobitsu
[travis-image]: https://img.shields.io/travis/liriliri/chobitsu?style=flat-square
[travis-url]: https://travis-ci.org/liriliri/chobitsu
[codecov-image]: https://img.shields.io/codecov/c/github/liriliri/chobitsu?style=flat-square
[codecov-url]: https://codecov.io/github/liriliri/chobitsu?branch=master
[license-image]: https://img.shields.io/npm/l/chobitsu?style=flat-square

Chrome devtools protocol JavaScript implementation.

## Install

You can get it on npm.

```bash
npm install chobitsu --save
```

## Usage

```javascript
const chobitsu = require('chobitsu');

chobitsu.setOnMessage(message => {
  console.log(message);
});

chobitsu.sendRawMessage(JSON.stringify({
  id: 1,  
  method: 'DOMStorage.clear',
  params: {
    storageId: {
      isLocalStorage: true,
      securityOrigin: 'http://example.com'
    }
  }
}));

!(async () => {
  console.log(await chobitsu.sendMessage('Storage.clearDataForOrigin', {
    storageTypes: 'local_storage'
  }));
})();

const domStorage = chobitsu.domain('DOMStorage');
domStorage.enable();
domStorage.on('domStorageItemUpdated', params => console.log(params));
```

## API

### sendRawMessage(message: string)

Send message to chobitsu.

### setOnMessage(onMessage: (message: string) => void)

Set message handler.

### sendMessage(method: string, params: any): Promise<any>

Send message without setting id and get result.

### domain(name: string)

Get domain object.

## Related Projects

* [chii](https://github.com/liriliri/chii): Remote debugging tool.
npm package: @ksky521/html-picker
Description: html picker
Author: Theo Wang
Latest version: 1.0.0

html-picker
======

## Usage

```js
const picker = require('@ksky521/html-picker');
picker(content, handlerMap);
```

## handlerMap

handlerMap是抓取的数据结构，抓取后会按照handlerMap的数据结构产出json数据。定义handlerMap的抓取结构是由`selector`和`handler`两个key组成的对象，例如：

```js
{
    selector: '',
    handler: ''
}
```
### selector
`selector`是跟jQuery（cheerio）的选择器，会在 **父节点（上一个抓取结构）** 下面查找子元素。

### handler
`handler` 是处理函数，支持jQuery（cheerio）的函数，比如：`text`（$.text()）、`html`（默认，$.html()）、`attr:xxx`（实际是$.attr('xxx'))

处理jQuery的函数外，还支持自定义函数，自定义函数接受两个参数，第一个是选择器之后处理的jQuery（cheerio）对象，第二个是全局的jQuery（cheerio）对象， **handler必须要有返回数据**，不然抓取的就是`undefined`：
```
{
    selector: 'li',
    handler: function($li, $){
        return $li.eq(0).text();
    }
}
```


### 抓取结构示例
```js
{
  content: {
    selector: '.box694 li',
    handler: 'text'
  }
}
```
上面的实际是查找页面`.box94 li`的节点，然后返回其`text()`内容，如果li是多个，那么是返回一个数组，最终会在callback函数获取data的格式是：
```js
{
    content: []
}
```

再看一个复杂的：
```js
{
  content: {
    selector: '.box694 li',
    handler: {
      ip: {
        selector: '.ip'
      },
      port: {
        selector: '.port'
      }
    }
  }
}
```
上面实际是抓取结构嵌套的示例，首先查找页面的`.box94 li`的节点，然后执行两个选择器：`'.ip'` 和 `'.port'`，最后传递给`callback`的数据结构是：

```js
{
    content: [{
        ip: 'xxx',
        port: 'xxx'
    },{
        ip: 'xxx',
        port: 'xxx'
    }, ...]
}
```

## 实例
```js
var spider = require('../lib/spider');

spider.get('http://guangdiu.com', function(err, $) {
    $('.gooditem').each(function(i, e) {
        console.log($(e).find('h2').text().trim());
    });
});

```


```js
var spider = require('../lib/spider');

var now = Date.now();
spider({
    proxy: 'http://42.62.61.245:80',
    uri: 'http://guangdiu.com',
    timeout: 5e3
}, function(error, data, req) {
    if (!error && data) {
        var t = Date.now();
        console.log(t - now);
    }
}, {
    item: {
        selector: '.gooditem',
        handler: {
            title: {
                selector: 'h2',
                handler: 'text'
            },
            prices: {
                selector: 'h2 .emphricepart',
                handler: 'text'
            },
            image: {
                selector: '.showpic img',
                handler: 'attr:src'
            }
        }
    }
});

```
npm package: @ksky521/inline-webpack-plugin
Description: webpack inline plugin
Author: ksky521
Latest version: 3.0.0

# inline-webpack-plugin

This is a webpack plugin to embed css/js chunk in the html ([html-webpack-plugin](https://github.com/jantimon/html-webpack-plugin) is needed).

## install

```bash
npm i @ksky521/inline-webpack-plugin -D
```

## Usage

```js
// webpack.config.js
const InlineWebpackPlugin = require('@ksky521/inline-webpack-plugin');
module.exports = {
    mode: 'development',
    output: {
        publicPath: 'https://cdn.example.com/assets/',
        path: __dirname + '/dist',
        filename: '[name].[hash:8].js'
    },
    entry: {
        main: './main.js',
        foo: './foo.js',
        bar: './bar.js',
        uninline: './uninline.js'
    },
    module: {
        rules: [
            {test: /\.html$/, loader: 'html-loader'},
            {
                test: /\.css$/i,
                use: [MiniCssExtractPlugin.loader, 'css-loader']
            }
        ]
    },
    plugins: [
        // ... html-webpack-plugin required!
        new InlineWebpackPlugin([
            {
                test(filepath, chunk) {
                    if (chunk.name === 'main' && /\.css$/.test(filepath)) {
                        // only for main.css
                        return true;
                    }
                },
                attrs: {
                    ['data-inline-props']: 'test'
                },
                placeholder: '<!-- main-css -->'
            },
            {
                test: /(foo|vendors)/
            },
            {
                test(filepath, chunk) {
                    if (chunk.name === 'bar' && /\.css$/.test(filepath)) {
                        return true;
                    }
                },
                content: 'hello world',
                remove: false,
                placeholder: '<!-- replaceit -->'
            }
        ])
    ]
};
```

You can find this demo in the [example](https://github.com/ksky521/inline-webpack-plugin/tree/master/example) directory and view the output:

```bash
npm i
npm run test
```

## Options

-   `test`: `string` | `function` | `RegExp`, when `test` is a function, the parameters of the function are:
    -   filepath: file path
    -   chunk: chunk object, chunk.name is chunk name.
-   `placeholder`: `string`, the placeholder. Default is _the assets tag_.
-   `content`: `string`, Default is 'undefined'.
-   `remove`: when it set `false`, the assets tag is not be removed. Default is `true'.

## Debug log

Use [debug](https://www.npmjs.com/package/debug) for log.

```bash
DEBUG=@ksky521/inline-webpack-plugin
```
npm package: @ksky521/markdown-it-katex
Description: Fast math support for markdown-it with KaTeX
Author: waylonflinn@gmail.com
Latest version: 2.1.3

# markdown-it-katex

Add Math to your Markdown

[![Build Status](https://travis-ci.org/waylonflinn/markdown-it-katex.svg?branch=master)](https://travis-ci.org/waylonflinn/markdown-it-katex)

[KaTeX](https://github.com/Khan/KaTeX) is a faster alternative to MathJax. This plugin makes it easy to support in your markdown.

Need convincing?

* Check out the comparative benchmark: [KaTeX vs MathJax](https://jsperf.com/katex-vs-mathjax/42)
* Try it in your browser: [markdown-it-katex demo](http://waylonflinn.github.io/markdown-it-katex/)

## Usage
Install markdown-it
```
npm install markdown-it
```

Install the plugin

```
npm install markdown-it-katex
```

Use it in your javascript

```javascript
var md = require('markdown-it')(),
    mk = require('markdown-it-katex');

md.use(mk);

// double backslash is required for javascript strings, but not html input
var result = md.render('# Math Rulez! \n  $\\sqrt{3x-1}+(1+x)^2$');
```

Include the KaTeX stylesheet in your html:
```html
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.5.1/katex.min.css">
```

If you're using the default markdown-it parser, I also recommend the [github stylesheet](https://github.com/sindresorhus/github-markdown-css):
```html
<link rel="stylesheet" href="https://cdn.jsdelivr.net/github-markdown-css/2.2.1/github-markdown.css"/>
```

`KaTeX` options can be supplied with the second argument to use.
```javascript
md.use(mk, {"throwOnError" : false, "errorColor" : " #cc0000"});
```

## Examples

### Inline
Surround your LaTeX with a single `$` on each side for inline rendering.
```
$\sqrt{3x-1}+(1+x)^2$
```

### Block
Use two (`$$`) for block rendering. This mode uses bigger symbols and centers
the result.

```
$$\begin{array}{c}

\nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} &
= \frac{4\pi}{c}\vec{\mathbf{j}}    \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\

\nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\

\nabla \cdot \vec{\mathbf{B}} & = 0

\end{array}$$
```

## Syntax

Math parsing in markdown is designed to agree with the conventions set by pandoc:

    Anything between two $ characters will be treated as TeX math. The opening $ must
    have a non-space character immediately to its right, while the closing $ must
    have a non-space character immediately to its left, and must not be followed
    immediately by a digit. Thus, $20,000 and $30,000 won’t parse as math. If for some
    reason you need to enclose text in literal $ characters, backslash-escape them and
    they won’t be treated as math delimiters.

## Math Syntax Support

KaTeX is based on TeX and LaTeX. Support for both is growing. Here's a list of
currently supported functions:

[Function Support in KaTeX](https://github.com/Khan/KaTeX/wiki/Function-Support-in-KaTeX)
npm package: @ksky521/queue
Description: 重复执行的**同一个函数的**队列，将参数添加进来，然后控制执行频次，支持事件
Author: Theo Wang
Latest version: 1.0.0

## Queue - task 队列管理

重复执行的**同一个函数的**队列，将参数添加进来，然后控制执行频次，支持事件

### Usage

```js
const Queue = require('@ksky521/queue');
const queue = new Queue(handler, 2);
arrays.forEach((url, i) => {
    queue.add([url, savePath]);
});
rs = {};
queue.run().then(
    data => {
        data.forEach(d => {
            if (d && d.url && d.name) {
                rs[d.url] = d.name;
            }
        });
        items.forEach(item => {
            let content = item.content.replace(/!\[\]\((.+?)\)/g, (input, $1) => {
                if (rs[$1]) {
                    return `![](${imgRelatePath}/${rs[$1]})`;
                }
                return input;
            });
            // console.log(content);
            item.content = content;
            delete item.links;
        });
        if (jsonPath) {
            fs.writeJSONSync(jsonPath, items);
        }
        resolve(items, rs.length);
    },
    e => {
        reject(e);
    }
);

```

### 事件

支持事件 `progress`，`progress`接收两个参数：当前第几个task，一共几个 task