# packify

> packs up browserify apps by inlining all assets into one html file

Latest version **1.1.2** (published 2014-06-11) · BSD license · 0 weekly downloads

## Install

```sh
npm install packify
pnpm add packify
yarn add packify
bun add packify
```

Provides the command `packify`.

## Health

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

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.1.2 |
| Published | 2014-06-11 |
| First published | 2014-06-10 |
| Weekly downloads | 0 |
| License | BSD |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 5 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 89 |
| Author | max ogden |
| Maintainers | maxogden |

## Links

- npm: https://www.npmjs.com/package/packify
- Repository: https://github.com/maxogden/packify
- Issues: https://github.com/maxogden/packify/issues
- npm.io page: https://npm.io/package/packify

## Dependencies (5)

- [brfs](https://npm.io/package/brfs.md) ^1.1.1
- [scriptify](https://npm.io/package/scriptify.md) ^0.2.0
- [concat-stream](https://npm.io/package/concat-stream.md) ^1.4.6
- [inline-images](https://npm.io/package/inline-images.md) ^1.0.1
- [inline-styles](https://npm.io/package/inline-styles.md) ^1.0.0

## Recent versions

- 1.1.2 (latest) — 2014-06-11
- 1.1.1 — 2014-06-10
- 1.1.0 — 2014-06-10
- 1.0.0 — 2014-06-10

## README

# packify

packs up browserify apps by inlining all assets into one html file

```
npm install packify -g
packify index.html > packed.html
```

![dat](http://img.shields.io/badge/Development%20sponsored%20by-dat-green.svg?style=flat)

## how it works

packify will do the following transformations:

- `<img src="foo.png">` -> `<img src="data:...">`
- `<link rel="stylesheet" href="foo.css">` -> `<style> /** styles here **/ </style>`
- `<script src="foo.js">` -> `<script> /** browserified foo.js here **/ </script>`
- `background-image { url(foo.png) }` -> `background-image { url('data:...') }`

all transformations are handled by dependencies: [inline-images](http://npmjs.org/inline-images), [inline-styles](http://npmjs.org/inline-styles), [imageinliner](https://www.npmjs.org/package/imageinliner) and [scriptify](http://npmjs.org/scriptify)

notes:

- `url(foo.png)` inside stylesheets will also get converted to inline data-uris
- only relative URIs will be transformed, e.g. `<script src="http://foo.com/foo.js">` will be ignored

## example

the [dat-editor](https://github.com/maxogden/dat-editor) module/application uses this.

before packify: https://github.com/maxogden/dat-editor/blob/master/index.html
after packify: https://github.com/maxogden/dat-editor/blob/master/prebuilt.html

`prebuilt.html` is generated by this npm command https://github.com/maxogden/dat-editor/blob/master/package.json#L8 (note the `brfs` transform https://github.com/maxogden/dat-editor/blob/master/package.json#L28-L32)

## usage

### javascript

```js
var packify = require('packify')

var opts = {
  html: "<html> ... your html here... </html>",
  args: ['arguments', 'for', 'browserify'],
  selector: 'script' // css selector passed to scriptify for it to select elements to browserify
}

packify(opts, function(err, packed) {
  console.log(packed.toString())
})
```

### CLI

```
packify <path-to-html-file>
```

when using on the CLI any additional arguments beyond the HTML file will be passed straight to browserify, e.g. 

```
packify index.html -t brfs
```

will run browserify like `browserify -t brfs`

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