Cleans up your HTML code from CSS.
$ npm install --save-dev digestioncss
You have a HTML file
<!-- file.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
<div id="hello" style="background:red">Hello!</div>
</body>
</html>
so you want take all styles attributes from HTML elements and put them on a CSS file. With digestioncss.js, just do that:
var DigestionCSS = require('digestioncss');
new DigestionCSS().digest({
file: 'file.html',
dest: 'public/css/file.css'
});
If the destination file already exists and is a CSS file, both will be joined. If not, it will be created. Also a link element referencing it will be added on the head of the HTML file.
#hello{background:red;}
<!-- file.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="public/css/file.css" type="text/css">
</head>
<body>
<div id="hello">Hello!</div>
</body>
</html>
Option to save your generated HTML in a new file.
new DigestionCSS().digest({
file: 'file.html',
newFile: 'new-file.html' // Will keep `file.html`
dest: 'public/css/file.css'
});
The option backupFile
saves a backup from the original HTML.
new DigestionCSS().digest({
file: 'file.html',
backupFile: 'backup-file.html'
dest: 'public/css/file.css'
});
There's options to enable beautifiers or minifiers for HTML and CSS. If the beautifier for a language is unabled, so it will be minified and vise-versa.
Language | Default value |
---|---|
HTML | true |
CSS | false |
Language | Default value |
---|---|
HTML | false |
CSS | true |
new DigestionCSS().digest({
file: 'file.html',
dest: 'public/css/file.css',
beautify: {
html: false,
css: true
}
});
You can use via command line also.
You can create a file with several files that you want to cleans up from CSS.
{
"files": [
{
"file": "foo.html",
"dest": "css/foocss.css"
},
{
"file": "bar.html",
"dest": "css/barcss.css",
"minify": {
"html": true
}
}
]
}
$ digestioncss
Basic:
$ digestioncss foo.html css/foocss.css
Option | Description |
---|---|
-n <file> /--new_file <file> |
Sends the new HTML to another file. |
-b <file> /--backup_file <file> |
Saves a backup from the original HTML. |
--minify_css |
Enable minifier for CSS. |
--minify_html |
Enable minifier for HTML. |
--beautify_css |
Enable beautifier for CSS. |
--beautify_html |
Enable beautifier for HTML. |
MIT License 2015 © Gabriel Jacinto.