transform-loader

[![npm][npm]][npm-url] [![node][node]][node-url] [![deps][deps]][deps-url] [![tests][tests]][tests-url] [![chat][chat]][chat-url]

A browserify transformation loader for webpack.

This loader allows use of browserify transforms via a webpack loader.query parameter

Requirements

This module requires a minimum of Node v6.9.0 and Webpack v4.0.0.

Getting Started

To begin, you’ll need to install transform-loader:

  1. $ npm install transform-loader --save-dev

Note: We’re using the coffeeify tranform for these examples.

Then invoke the loader through a require like so:

  1. const thing = require('!transform-loader?coffeeify!widget/thing');

Or add the loader to your webpack config. For example:

  1. // entry.js
  2. import thing from 'widget/thing';
  1. // webpack.config.js
  2. module.exports = {
  3. module: {
  4. rules: [
  5. {
  6. test: /\.coffee?$/,
  7. loader: `transform-loader?coffeeify`,
  8. // options: {...}
  9. },
  10. ],
  11. },
  12. }

And run webpack via your preferred method.

QueryString Options

When using the loader via a require query string you may specify one of two types; a loader name, or a function index.

Type: String

The name of the browserify transform you wish to use.

Note: You must install the correct transform manually. Webpack nor this loader will do that for you.

Type: Number

The index of a function contained within options.transforms which to use to transform the target file(s).

Options

transforms

Type: Array[Function] Default: undefined

An array of functions that can be used to transform a given file matching the configured loader test. For example:

  1. // entry.js
  2. const thing = require('widget/thing');
  1. // webpack.config.js
  2. const through = require('through2');
  3. module.exports = {
  4. module: {
  5. rules: [
  6. {
  7. test: /\.ext$/,
  8. // NOTE: we've specified an index of 0, which will use the `transform`
  9. // function in `transforms` below.
  10. loader: 'transform-loader?0',
  11. options: {
  12. transforms: [
  13. function transform() {
  14. return through(
  15. (buffer) => {
  16. const result = buffer
  17. .split('')
  18. .map((chunk) => String.fromCharCode(127 - chunk.charCodeAt(0)));
  19. return this.queue(result).join('');
  20. },
  21. () => this.queue(null)
  22. );
  23. }
  24. ]
  25. }
  26. }
  27. ]
  28. }
  29. }

License

MIT MIT” class=”icon-link” href=”#mit”>