https://github.com/d8corp/innet-html

Convert jsx elements into html text
https://github.com/d8corp/innet-html

Last synced: about 1 year ago
JSON representation

Convert jsx elements into html text

• Host: GitHub
• URL: https://github.com/d8corp/innet-html
• Owner: d8corp
• License: mit
• Created: 2022-02-20T14:54:35.000Z (over 4 years ago)
• Default Branch: main
• Last Pushed: 2022-03-23T17:27:12.000Z (over 4 years ago)
• Last Synced: 2025-03-21T09:03:58.033Z (over 1 year ago)
• Language: JavaScript
• Size: 92.8 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md
  • License: LICENSE

Awesome Lists containing this project

README

          


  



#   @innet/html

 

[![NPM](https://img.shields.io/npm/v/@innet/html.svg)](https://github.com/d8corp/innet-html/blob/main/CHANGELOG.md)

[![minzipped size](https://img.shields.io/bundlephobia/minzip/@innet/html)](https://bundlephobia.com/result?p=@innet/html)

[![downloads](https://img.shields.io/npm/dm/@innet/html.svg)](https://www.npmjs.com/package/@innet/html)

[![license](https://img.shields.io/npm/l/@innet/html)](https://github.com/d8corp/innet-html/blob/main/LICENSE)

## Abstract

This package helps to convert jsx elements into html text.

[![stars](https://img.shields.io/github/stars/d8corp/innet-html?style=social)](https://github.com/d8corp/innet-html/stargazers)

[![watchers](https://img.shields.io/github/watchers/d8corp/innet-html?style=social)](https://github.com/d8corp/innet-html/watchers)

## Install

npm

```bash

npm i @innet/html

```

yarn

```bash

yarn add @innet/html

```

Or you can include the scripts into the `head`.

```html

```

## Usage

You can use `htmlPlugin` when you want to convert whole app.

```typescript jsx

import innet, { createHandler } from 'innet'

import { htmlPlugin } from '@innet/html'

const handler = createHandler([

  htmlPlugin,

])

innet(
, handler)

// '
'

```


You can combine it with other plugins to handle deep html.

```typescript jsx

import innet, { createHandler } from 'innet'

import { array, arraySync } from '@innet/utils'

import { htmlPlugin } from '@innet/html'

const join = () => arr => arr.join('')

const handler = createHandler([

  htmlPlugin,

  array([

    arraySync,

    join,

  ])

])

innet((

  <>

    
Test

    


      

        

      

      


        Hello World!

      

    

  >

), handler)

```


Also, you can use jsx plugin of `html` to handle it inside `html` component

`handler.ts`

```typescript jsx

import { createHandler } from 'innet'

import { array, arraySync, nullish, object, stop } from '@innet/utils'

import html from '@innet/html'

const join = () => arr => arr.join('')

export const handler = createHandler([

  nullish([stop]),

  array([arraySync, join]),

  object([

    jsxPlugins({

      html,

    }),

  ]),

])

```

`index.tsx`

```typescript jsx

import innet from 'innet'

import { handler } from './handler'

innet(

```

## Issues

If you find a bug or have a suggestion, please file an issue on [GitHub](https://github.com/d8corp/innet-html/issues).

[![issues](https://img.shields.io/github/issues-raw/d8corp/innet-html)](https://github.com/d8corp/innet-html/issues)