Using babel plugin to dynamically require a resource

[gajus]

Since this is done at the compilation time, I expect the following to work:

import path from 'path';

export default (options) => {
    let dirname,
        info,
        target;

    dirname = path.dirname(options.filename);
    target = path.resolve(dirname, 'index.json');

    info = require(target);

    return (ReactClass) => {
        return ReactClass;
    };
};

But that produces an error in webpack:

WARNING in ../react-transform-css-modules/dist/index.js
Critical dependencies:
23:11-26 the request of a dependency is an expression
 @ ../react-transform-css-modules/dist/index.js 23:11-26

WARNING in Loader /Users/gajus/Documents/dev/gajus/react-transform-css-modules/node_modules/babel/index.js didn't return a function
 @ ../react-transform-css-modules/dist ^\.\/.*$

and an error in the browser:

Uncaught Error: Cannot find module '/Users/gajus/Documents/dev/gajus/babel-react-css-modules-test/src/index.json'.

Is there a way to do it?

[gaearon]

Transform itself executes at module definition time.
At compile time, we only generate the call to it.

That said, you can put some path in imports:

{
  "stage": 0,
  "plugins": [
    "react-transform"
  ],
  "extra": {
    "react-transform": [{
      "target": "react-transform-css-modules",
      "imports": ["./src/index.json"]
    }]
  }
}

This module will be available as options.imports[0] in the transform.