@nikolarhristov/pipeline
Version:
🧪 Pipeline for files.
232 lines (176 loc) • 5.02 kB
Markdown
# [@nikolarhristov/pipeline] 🧪
## Installation
First, install the `@nikolarhristov/pipeline` component like so:
```
npm install -D -E @nikolarhristov/pipeline
```
Then, create a new pipeline from this component:
**`index.ts`**
```ts
import { pipeline } from "@nikolarhristov/pipeline";
new pipeline({
path: "./input/",
});
```
## Getting started
The pipeline will now provide you with a process method which you can use to
call the callback on each file from the pipeline.
**`index.ts`**
```ts
import { pipeline } from "@nikolarhristov/pipeline";
await new pipeline({
path: "./input/",
files: "**/*.md",
pipeline: {
// Prepend some content to all of the text files
wrote: (current) => (current.buffer += "LICENSE [MIT]"),
},
}).process();
```
These are the defaults for each callback.
```ts
import { pipeline } from "@nikolarhristov/pipeline";
import * as fs from "fs";
await new pipeline({
pipeline: {
wrote: async (current) => current.buffer,
read: async (current) =>
await fs.promises.readFile(current.inputPath, "utf-8"),
passed: async () => true,
failed: async (inputPath) => `Error: Cannot process file ${inputPath}!`,
accomplished: async (current) =>
`Processed ${current.inputPath} in ${current.outputPath}.`,
fulfilled: async (pipe) =>
`Successfully processed a total of ${pipe.files} ${
pipe.files === 1 ? "file" : "files"
}.`,
changed: async (pipe) => pipe,
},
});
```
or you can query the files object directly:
```ts
import { files } from "@nikolarhristov/pipeline";
import * as fs from "fs";
await (
await (await new files().in("./input/")).by("**/*.md")
).pipeline({
wrote: async (current) => current.buffer,
read: async (current) =>
await fs.promises.readFile(current.inputPath, "utf-8"),
passed: async () => true,
failed: async (current) =>
`Error: Cannot process file ${current.inputPath}!`,
accomplished: async (current) =>
`Processed ${current.inputPath} in ${current.outputPath}.`,
fulfilled: async (pipe) =>
`Successfully processed a total of ${pipe.files} ${
pipe.files === 1 ? "file" : "files"
}.`,
changed: async (pipe) => pipe,
});
```
The pipeline has built in methods which you can use to compress your CSS, HTML
and JavaScript or inline the critical CSS in the HTML files in that directory.
**`index.ts`**
```ts
import { pipeline } from "@nikolarhristov/pipeline";
await (
await new pipeline({
path: "./input/",
}).compress()
).critters();
```
The following image file types will also be compressed:
- avci
- avcs
- avif
- avifs
- gif
- heic
- heics
- heif
- heifs
- jfif
- jif
- jpe
- jpeg
- jpg
- png
- raw
- tiff
- webp
SVG compression is supported, as well via [svgo].
You can override any of the default options from the configurations of:
- [critters](https://github.com/GoogleChromeLabs/critters#usage)
- [csso](https://github.com/css/csso#minifysource-options)
- [html-minifier-terser](https://github.com/terser/html-minifier-terser#options-quick-reference)
- [sharp](https://sharp.pixelplumbing.com/api-output#jpeg)
- [svgo](https://github.com/svg/svgo#configuration)
- [terser](https://github.com/terser/terser#minify-options-structure)
or disable them entirely:
**`index.ts`**
```ts
import { pipeline } from "@nikolarhristov/pipeline";
new pipeline({
path: "./input/",
critters: false,
css: false,
html: false,
img: false,
js: false,
svg: false,
});
```
You can add multiple paths to `compress` or `critters` by specifying an array as
the `path` variable.
**`index.ts`**
```ts
import { pipeline } from "@nikolarhristov/pipeline";
new pipeline({
path: ["./input/", "./input2/"],
});
```
You can also provide a map of paths for different input output directories.
**`index.ts`**
```ts
import { pipeline } from "@nikolarhristov/pipeline";
new pipeline({
path: new Map([["./input", "./output"]]),
});
```
Or an array of the two.
**`index.ts`**
```ts
import { pipeline } from "@nikolarhristov/pipeline";
new pipeline({
path: ["./input", new Map([["./input", "./output"]])],
});
```
You can provide a filter to exclude files from your pipeline. A filter can be an
array of regexes or a single match. You can use functions, as well to match on
file names.
**`index.ts`**
```ts
import { pipeline } from "@nikolarhristov/pipeline";
new pipeline({
exclude: [
"my-awesome.file",
(file: string) =>
file === "./input/this-file-will-not-be-processed.txt",
],
});
```
Set `logger` to `0` if you do not want to see debug messages. Default is `2`.
**`index.ts`**
```ts
import { pipeline } from "@nikolarhristov/pipeline";
new pipeline({
logger: 0,
});
```
[@nikolarhristov/pipeline]: https://npmjs.org/@nikolarhristov/pipeline
[svgo]: https://npmjs.org/svgo
## Changelog
See [CHANGELOG.md](CHANGELOG.md) for a history of changes to this component.
[](https://github.com/Lightrix/npm)