# replace-inline-css

> This library allows you to replace all inline-css () of a given html file with a single css class

Latest version **1.3.0** (published 2021-07-13) · MIT license · 0 weekly downloads

## Install

```sh
npm install replace-inline-css
pnpm add replace-inline-css
yarn add replace-inline-css
bun add replace-inline-css
```

## Health

**Score 20/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.3.0 |
| Published | 2021-07-13 |
| First published | 2021-07-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 3 |
| Unpacked size | 11 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Maintainers | sahar.avr |
| Keywords | inline css, replace inline css, replace-inline-css, remove style, refactor style, refactor css, refactor html, remove html style |

## Links

- npm: https://www.npmjs.com/package/replace-inline-css
- Repository: https://github.com/SaharAvr/replace-inline-css
- Homepage: https://github.com/SaharAvr/replace-inline-css.git#readme
- Issues: https://github.com/SaharAvr/replace-inline-css/issues
- npm.io page: https://npm.io/package/replace-inline-css

## Dependencies (3)

- [jsdom](https://npm.io/package/jsdom.md) 16.6.0
- [fs-extra](https://npm.io/package/fs-extra.md) 10.0.0
- [object-hash](https://npm.io/package/object-hash.md) 2.2.0

## Alternatives

- [@tsparticles/shape-image](https://npm.io/package/@tsparticles/shape-image.md) — 303.7K weekly downloads
- [@tsparticles/shape-line](https://npm.io/package/@tsparticles/shape-line.md) — 233.7K weekly downloads
- [stringify-attributes](https://npm.io/package/stringify-attributes.md) — 58.6K weekly downloads
- [mobile-drag-drop](https://npm.io/package/mobile-drag-drop.md) — 46.3K weekly downloads
- [@comunica/actor-rdf-parse-html](https://npm.io/package/@comunica/actor-rdf-parse-html.md) — 29.2K weekly downloads

## Recent versions

- 1.3.0 (latest) — 2021-07-13
- 1.2.7 — 2021-07-13
- 1.2.6 — 2021-07-13
- 1.2.5 — 2021-07-13
- 1.1.5 — 2021-07-13
- 1.0.5 — 2021-07-13
- 1.0.4 — 2021-07-13
- 1.0.3 — 2021-07-13
- 1.0.2 — 2021-07-12
- 1.0.1 — 2021-07-12
- 1.0.0 — 2021-07-12

## README

# replace-inline-css


This library allows you to replace all inline-css (`<div style="...">`) of a given html file with a single css class


- Deletes all `style` properties from all the html elements
- Adds a `<style>{ ... }</style>` with new css classes, containing all inline styles
- Reuses classes when styles share the same properties and values
- ✨Magic ✨

## Installation

replace-inline-css requires [Node.js](https://nodejs.org/) v10+ to run.

`yarn`:

```sh
$ yarn add replace-inline-css
```
`npm`:
```sh
$ npm i replace-inline-css
```

## Usage

Simply `require` the module and use it as a function.
```js
const replaceInlineCss = require('replace-inline-css');

replaceInlineCss('./input.html', './output.html');

// Alternativley, you can pass an html string and play with the result

const newHtml = replaceInlineCss(html);
```

##### input.html:
`style` attributes all over:

![Image of input.html](https://raw.githubusercontent.com/SaharAvr/replace-inline-css/assets/before.png)

##### output.html:
Removed all `style` attributes & added references to new css classes:

![Image of output.html](https://raw.githubusercontent.com/SaharAvr/replace-inline-css/assets/after.png)

New `<style>` section added to the `head`:

![Image of output.html](https://raw.githubusercontent.com/SaharAvr/replace-inline-css/assets/style.png)



## License

MIT

**Free Software, Hell Yeah!**

---
_Source: https://npm.io/package/replace-inline-css · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
