transform-loader

transform-loader copied to clipboard

According to https://github.com/webpack-contrib/transform-loader/issues/20 passing transforms in options within the rule works, but it was throwing this for me:

     Uncaught ./~/transform-loader?{"transforms":[null]}!./XXX
Module build failed: Error: Can't resolve 'transforms' in 'XXX'

That was with this:

  module: {
      rules: [
        {
          test: /\.js$/,
          loader: 'transform-loader?0',
          options: {
            transforms: [
               staticify(staticifyConfig),
           ],
         },
        },
      ],
    },

I had to revert to using webpack.LoaderOptionsPlugin and the plugins part of my configuration for it to work.

+1

Could you try with an explicit ident so the {Function} references are kept

{
  test: /\.js$/,
  use:  [
    { 
      loader: 'transform-loader', 
      options: {
        ident: 'transform' // value (name) doesn't matter
        transforms: [
          staticify(staticifyConfig)
        ]
      }
    ]
  }
}

https://webpack.js.org/api/loaders/#this-query

If the loader was configured with an options object, this will point to that object. If the loader has no options, but was invoked with a query string, this will be a string starting with ?.

https://github.com/webpack-contrib/transform-loader/blob/083638b32b1467d25afc43c661dc626ce48c7646/index.js#L17-L20

If options set, it just run as next(this.options.transforms['transforms']); in Webpack 3.

Any chance of this to be fixed after one year? If I understand right, this means that using a function as a transform is impossible in Webpack 3. No one is needing it? Or is it fixed in Webpack 4?

Possibly outdated by this point -- also I have do not have the surrounding context to explore this further in webpack 4, but my OP explained that you could get around this with webpack.LoaderOptionsPlugin and plugins

Using webpack 4 and seems there's no way to use local transform functions.

I managed to get the correct transform index by using:

{        
        loader: "transform-loader?0",
        options: {
          '0': true,
          transforms: [
            function moduleBrfs(resource) {
              return brfs(resource, {
                parserOpts: {
                  sourceType: 'module'
                }
              })
            }
          ]
        }
      }

But it fails because this.options in this line is undefined. This behavior occurs because when options is defined, it becomes this.query and this.options is removed