inline-source

Inline and compress tags that contain the inline attribute. Supports








`

`javascript
import { inlineSource } from 'inline-source';
import fs from 'node:fs';
import path from 'node:path';

const htmlpath = path.resolve('project/src/html/index.html');

inlineSource(htmlpath, {
compress: true,
rootpath: path.resolve('www'),
// Skip all css types and png formats
ignore: ['css', 'png'],
})
.then((html) => {
// Do something with html
})
.catch((err) => {
// Handle error
});
`

...or preferably using async/await:

`javascript
import { inlineSource } from 'inline-source';
import fs from 'node:fs';
import path from 'node:path';

const htmlpath = path.resolve('project/src/html/index.html');

try {
const html = await inlineSource(htmlpath, {
compress: true,
rootpath: path.resolve('www'),
// Skip all css types and png formats
ignore: ['css', 'png'],
});
// Do something with html
} catch (err) {
// Handle error
}
`

$3

Custom handlers are simple middleware-type functions that enable you to provide new, or override existing, inlining behaviour. All handlers have the following signature: (source: Source, context: Context) => Promise | void

- source: the current source object to act upon

- attributes: the parsed tag attributes object
- compress: the compress flag (may be overriden at the tag level via props)
- content: the processed fileContent string
- extension: the file extension
- fileContent: the loaded file content string
- filepath: the fully qualified path string
- format: the format string (jpg, gif, svg+xml, etc)
- match: the matched html tag string, including closing tag if appropriate
- props: the parsed namespaced attributes object (see props)
- replace: the tag wrapped content string to replace match
- tag: the tag string (script, link, etc)
- type: the content type based on type mime-type attribute, or tag (js for application/javascript, css for text/css, etc)

- context: the global context object storing all configuration options (attribute, compress, ignore, pretty, rootpath, swallowErrors, svgAsImage), in addtion to:

- html: the html file's content string
- htmlpath: the html file's path string
- sources: the array of source objects

Custom handlers are inserted before the defaults, enabling overriding of default behaviour:

`js
export function handler(source, context) {
if (source.fileContent && !source.content && source.type == 'js') {
source.content = "Hey! I'm overriding the file's content!";
}
}
`

In general, default file content processing will be skipped if source.content is already set, and default wrapping of processed content will be skipped if source.replace is already set.

$3

Custom pre handlers are the same as custom handlers only they run before loading the file. All handlers have the following signature: (source: Source, context: Context) => Promise | void

With custom Pre handlers you can make changes to the file name

`js
export function prehandler(source, context) {
const { version } = getVersionFromSomewhere();
source.filepath = source.filepath.replace('.js', _${version}.js);
}
`

$3

Source props are a subset of attributes that are namespaced with the current global attribute ('inline' by default), and allow declaratively passing data or settings to handlers:

`html
inline
inline-foo="foo"
inline-compress="false"
src="../src/js/inlineScript.js"
>
`

`js
export function handler(source, context) {
if (source.fileContent && !source.content && source.type == 'js') {
// The inline-compress attribute automatically overrides the global flag
if (!source.compress) {
// do something
}
if (source.props.foo == 'foo') {
// foo content
}
}
}
``