transform-loader's Introduction

Transform Loader

Use browserify transforms as webpack-loader.

Install

npm i transform-loader --save

Usage

Pass the module name as query parameter.

var x = require("!transform-loader?brfs!./file.js");

If you pass a number instead it will take the function from this.options.transforms[number].

webpack 2 config example

module.exports = {
  module: {
    rules: [
      {
        loader: "transform-loader?brfs",
        enforce: "post",
        options: {
          transforms: [
              function (/*file*/) {
                  return through((buffer) => {
                      return this.queue(
                          buffer.split('')
                              .map((chunk) => String.fromCharCode(127-chunk.charCodeAt(0))))
                              .join('')
                  }, () => this.queue(null))
              }
          ]
        }
      },

      {
        test: /\.weirdjs$/,
        loader: "transform-loader?0",
        options: {
          transforms: [
              function (/*file*/) {
                  return through((buffer) => {
                      return this.queue(
                          buffer.split('')
                              .map((chunk) => String.fromCharCode(127-chunk.charCodeAt(0))))
                              .join('')
                  }, () => this.queue(null))
              }
          ]
        }
      }
    ]
  }
};

Typical brfs Example

Say you have the following Node source:

var test = require('fs').readFileSync('./test.txt', 'utf8');

After npm install transform-loader brfs --save, add the following loader to your config:

module.exports = {
    context: __dirname,
    entry: "./index.js",
    module: {
        loaders: [
            {
                test: /\.js$/,
                loader: "transform-loader?brfs"
            }
        ]
    }
}

The loader is applied to all JS files, which can incur a performance hit with watch tasks. So you may want to use transform-loader/cacheable?brfs instead.