Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

ify-loader

Package Overview
Dependencies
Maintainers
35
Versions
6
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

ify-loader

Webpack loader to handle browserify transforms as intended

  • 1.1.0
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
5.9K
decreased by-7.09%
Maintainers
35
Weekly downloads
 
Created
Source

ify-loader

experimental

Webpack loader to handle browserify transforms as intended.

Usage

Install the loader using npm:

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:

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:

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:

{
  "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 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 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, 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

License

MIT, see LICENSE.md for details.

Keywords

FAQs

Package last updated on 18 Sep 2017

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc