# ify-loader

> Webpack loader to handle browserify transforms as intended

Latest version **1.1.0** (published 2017-09-18) · MIT license · 0 weekly downloads

## Install

```sh
npm install ify-loader
pnpm add ify-loader
yarn add ify-loader
bun add ify-loader
```

## 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.0 |
| Published | 2017-09-18 |
| First published | 2016-01-02 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 7 |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 68 |
| Author | Hugh Kennedy |
| Maintainers | etpinard, bpostlethwaite, mattdesl, hughsk, fpereira1, anandthakker, bret, garann, leichtgewicht, forbeslindesay, yerkopalma, parshap, elnounch, ahdinosaur, ungoldman, yoshuawuyts, sethvincent, jryans, indutny, jprichardson, dcousens, cwmma, balupton, ashaffer88, mellowmelon, jmm, terinjokes, thlorenz, dominictarr, maxogden, mafintosh, zertosh, gkatsev, feross, substack |
| Keywords | ify, browserify, loader, webpack |

## Links

- npm: https://www.npmjs.com/package/ify-loader
- Repository: https://github.com/hughsk/ify-loader
- Issues: https://github.com/hughsk/ify-loader/issues
- npm.io page: https://npm.io/package/ify-loader

## Dependencies (7)

- [bl](https://npm.io/package/bl.md) ^1.0.0
- [findup](https://npm.io/package/findup.md) ^0.1.5
- [resolve](https://npm.io/package/resolve.md) ^1.1.6
- [map-limit](https://npm.io/package/map-limit.md) 0.0.1
- [multipipe](https://npm.io/package/multipipe.md) ^0.3.0
- [from2-array](https://npm.io/package/from2-array.md) 0.0.4
- [read-package-json](https://npm.io/package/read-package-json.md) ^2.0.2

## Alternatives

- [@opentelemetry/exporter-zipkin](https://npm.io/package/@opentelemetry/exporter-zipkin.md) — 14.8M weekly downloads
- [pusher-js](https://npm.io/package/pusher-js.md) — 2.0M weekly downloads
- [browserify](https://npm.io/package/browserify.md) — 1.7M weekly downloads
- [sqs-consumer](https://npm.io/package/sqs-consumer.md) — 1.7M weekly downloads
- [@sanity/eventsource](https://npm.io/package/@sanity/eventsource.md) — 930.8K weekly downloads

## Recent versions

- 1.1.0 (latest) — 2017-09-18
- 1.0.4 — 2017-03-18
- 1.0.3 — 2016-01-03
- 1.0.2 — 2016-01-03
- 1.0.1 — 2016-01-02
- 1.0.0 — 2016-01-02

## README

# ify-loader

[![experimental](http://badges.github.io/stability-badges/dist/experimental.svg)](http://github.com/badges/stability-badges)

[Webpack](https://github.com/webpack/webpack) loader to handle [browserify transforms](https://github.com/substack/browserify-handbook#browserifytransform-field) as intended.

## Usage

Install the loader using [npm](https://npmjs.com/):

``` glsl
npm install --save ify-loader
```

You can then update your `webpack.config.js` in a similar fashion to the following to add browserify transform support to your project's dependencies:

``` javascript
module.exports = {
  module: {
    loaders: [
      // This applies the loader to all of your dependencies,
      // and not any of the source files in your project:
      {
        test: /node_modules/,
        loader: 'ify-loader'
      }
    ]
  }
}
```

### Using transforms in your project

Note that you're also free to apply this loader to files in your own project. Include the following in your project's `webpack.config.js`:

``` javascript
module.exports = {
  module: {
    loaders: [
      // support local package.json browserify config
      {
        test: /\.js$/,
        loader: 'ify-loader',
        enforce: 'post'
      }
    ]
  }
}
```

Any browserify transforms you include in `package.json` will get picked up and applied this way:

``` json
{
  "name": "my-project",
  "dependencies": {
    "glslify": "5.0.0",
    "brfs": "1.4.2"
  },
  "browserify": {
    "transform": [
      "glslify",
      "brfs"
    ]
  }
}
```

## Why?

When given the choice, I lean more in favour of [browserify](http://browserify.org) for its simplicity and compatability with node.js — however from time to time I need to work on projects that use webpack. The thing I run into issues with most often when switching between the two is the difference in how webpack handles source transforms compared to browserify.

Webpack provides you with a "global" configuration where you specify how your project and its dependencies are transformed in a single place. Browserify, however, scopes transforms to the current package to avoid conflicts between different dependencies' sources using the  [`browserify.transform` property](https://github.com/substack/node-browserify#browserifytransform) in `package.json`.

There are pros and cons to both approaches — Webpack gives you more control, at the expense of having to configure each transform used in your dependency tree. Unlike [transform-loader](https://github.com/webpack/transform-loader), *ify-loader* will automatically determine which browserify transforms to apply to your dependencies for you the same way that browserify itself does, making the process a lot more bearable in complex projects!

## See Also

* [browserify](https://github.com/substack/node-browserify)
* [webpack](https://github.com/webpack/webpack)
* [transform-loader](https://github.com/webpack/transform-loader)

## License

MIT, see [LICENSE.md](http://github.com/hughsk/ify-loader/blob/master/LICENSE.md) for details.

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