Custom loaders support for imported via @import directive files

[SkReD]

No description provided.

[jsf-clabot]

Thank you for your submission, we really appreciate it. Like many open source projects, we ask that you sign our Contributor License Agreement before we can accept your contribution.

[jhnns]

Thank you for your pull-request. I think, importLoaders are not necessary anymore since with webpack 2 you can specify different loader pipelines depending on the issuer. Does this solve your use-case?

[SkReD]

Don't quite understand how issuer is should be used. And how nested rules should be configured and how they applied. Could you provide some examples here on in webpack docs?

[jhnns]

While trying this out, I saw that this is currently not possible. I have to adjust the less-loader (and the sass-loader) to make this possible, but I have a working copy that I will probably publish the next days.

With a workaround (by using the enforce option), however, this is already possible.

This is how the webpack.config.js would look like:

module.exports = {
    entry: [
        require.resolve("./entry.less"),
        require.resolve("./entry.js"),
    ],
    output: {
        filename: "bundle.js"
    },
    module: {
        rules: [
            {
                test: /\.js$/,

                // if the requesting module is a less file, than use this loader pipeline
                issuer: /\.less$/,

                enforce: "pre", // quick fix, enforce won't be necessary after less-loader fix
                use: [{
                    loader: require.resolve("./jsToLessLoader.js")
                }]
            },
            {
                test: /\.less$/,
                use: [{
                    loader: "css-loader"
                }, {
                    loader: "less-loader"
                }]
            }
        ]
    }
};

// entry.less
@import "./a.js"; // don't omit the extension, because less will assume .less files

// entry.js
import a from "./a";

// a.js
export default 42;

---

Does this solve your use-case?

Could you provide some examples here on in webpack docs?

We will probably publish some loader tips and best practices.

[SkReD]

Yes. This is exactly what i need. Thank you