Skip to content

Latest commit

 

History

History
165 lines (134 loc) · 3.61 KB

README.md

File metadata and controls

165 lines (134 loc) · 3.61 KB
Raw

html-include-external-resources

Simple utility to inline external HTML resources from <script> <links /> <img /> into single HTML file.

npm PRs Welcome

Features

  • Full Control over output configuration, Print to console 💻, Write to file 📁 or simply Copy to clipboard 📋 .
  • Converts and inlines 🖼 source into base64 string🤓.
  • Configurable html tags to be processed 🛠.
  • Node API
Contents
CLI Usage
Node API Usage
Recipies

CLI Usage

npx html-inline-external --src index.html >> output.html

Input:

index.html

<html>
    <head>
        <script type="text/javascript" src="./index.js"></script>
        <link rel="stylesheet" href="styles.css">
    </head>
    <body>
        Hello World
    </body>
</html>

index.js

alert("This is an alert!")

styles.css

body {
    background-color: black;
    color: white;
}

Output:

> npx html-inline-external --src ./index.html >> output.html

output.html

<html>
  <head>
    <script type="text/javascript">
      alert("This is an alert!")
    </script>
    <link rel="stylesheet" href="styles.css">
    <style>
      body {
        background-color: black;
        color: white;
      }
    </style>
  </head>
  <body>
    Hello World
  </body>
</html>

Options :

Option Default Desscription
src N/A Path to the source file
dest N/A Path to the destination file
tags script, link, img List HTML Tags to be processed in csv format
copy false Copies the process output to clipboard
pretty false Prettify output
minify false Minify output

Node API Usage

  • Install html-inline-external using your package manager
npm install html-inline-external --save

OR

yarn add html-inline-external
  • Use it in your NodeJS file
htmlInlineExternal({options})
  • Example
const htmlInlineExternal = require('html-inline-external')

htmlInlineExternal({src: './test/index.html'}).then(output => console.log(output))

API Options :

Option Default Desscription
src N/A Path to the source file
tags script, link, img List HTML Tags to be processed in csv format
pretty false Prettify output
minify false Minify output

Recipies

Write output to file:

Uses node fs and writes the output into the given file path

> npx html-inline-external --src ./index.html --dest ./output.html 

> [Log] Wrote to file output.html.

Copy processed output to clipboard:

Copies the processed output to clipboard, Could be accessed by simply hitting Ctrl/Cmd + V

> npx html-inline-external --src ./index.html --copy 

> [Log]: Copied to clipboard.

Prettify processed output:

Prettifies the processed output

> npx html-inline-external --src ./index.html --pretty --dest ./output.html 

> [Log] Wrote to file output.html

Minfy processed output:

Minifies the processed output to remove whitespaces

> npx html-inline-external --src ./index.html --minify --dest ./output.html 

> [Log] Wrote to file output.html