CODEWITHSUNDEEP
webpackwebpack-2
mpen
mpen

Reputation: 283273

How to define a loader inline?

The docs give an example of a loader here, and the old docs say I should be able to define an "identity loader" by returning what I'm given.

So in theory, adding i => i to my list of loaders (like below) shouldn't break anything.

module: {
    rules: [
        ...
        {
            test: /\.less$/,
            use: [ i => i, ...cssLoaders, lessLoader],
        },
    ]
},

But it causes this error:

/home/me/Projects/myproj/node_modules/enhanced-resolve/lib/Resolver.js:151
    var idxQuery = identifier.indexOf("?");

                         ^
TypeError: Cannot read property 'indexOf' of undefined

Which is not in my code, but must be the result of me giving webpack something unexpected.

So what's the proper syntax for defining a loader (that does nothing) that I can use in the use array like that (without publishing a node module)?

Upvotes: 5

Views: 4207

Answers (1)

aretecode
aretecode

Reputation: 334

breakdown

(pseudo code for understanding the concepts before reading the provided links to the full code)

use resolveLoader.alias to "load" your loader

// in webpack config
resolveLoader: {
    alias: {
        'minimal-loader': require('path').resolve('./minimal-loader'),
    },
},

then you can access it via a string, in rules, as you were thinking, with an array of use

  module: {
    rules: [
        {
            test: /(.*)/,
            use: [{loader: 'minimal-loader'}],
        },
    ],
},

resources

code

(working minimal examples made to show how to achieve this, as well as how to debug as you play around with it)

Upvotes: 2

Related Questions