Webpack-cli: Migrate: Missing `loader` property for migrated loader config with options

Created on 18 Mar 2017 · 2Comments · Source: webpack/webpack-cli

Do you want to request a feature or report a bug?

Bug

What is the current behavior?
For a loader config with options, the config below gets migrated to the configuration use: 'loader-name'. This results in an error when the config is used at build time.

The following config:

{
    test: /\.js$/,
    exclude: /(node_modules)/,
    loader: 'babel-loader',
    query: {
        presets: ['env']
    }
}

...is migrated to:

{
    test: /\.js$/,
    exclude: /(node_modules)/,
    use: 'babel-loader',
    options: {
        presets: ['env']
    }
}

When the loader config above is used when building, it results in build error options/query provided without loader.

Stack trace:

/Development/webpack-output-by-build-type/node_modules/webpack/lib/RuleSet.js:169
        throw new Error(RuleSet.buildErrorMessage(rule, new Error("options/query provided without loader (use loader + options)")));
        ^

Error: options/query provided without loader (use loader + options) in {
  "test": {},
  "exclude": {},
  "use": "babel-loader",
  "options": {
    "presets": [
      "env"
    ]
  }
}
    at Function.RuleSet.normalizeRule (/Development/webpack-output-by-build-type/node_modules/webpack/lib/RuleSet.js:169:9)
    at /Development/webpack-output-by-build-type/node_modules/webpack/lib/RuleSet.js:84:19
    at Array.map (native)
    at Function.RuleSet.normalizeRules (/Development/webpack-output-by-build-type/node_modules/webpack/lib/RuleSet.js:83:16)
    at new RuleSet (/Development/webpack-output-by-build-type/node_modules/webpack/lib/RuleSet.js:76:23)
    at new NormalModuleFactory (/Development/webpack-output-by-build-type/node_modules/webpack/lib/NormalModuleFactory.js:46:17)
    at Compiler.createNormalModuleFactory (/Development/webpack-output-by-build-type/node_modules/webpack/lib/Compiler.js:439:28)
    at Compiler.newCompilationParams (/Development/webpack-output-by-build-type/node_modules/webpack/lib/Compiler.js:452:29)
    at Compiler.compile (/Development/webpack-output-by-build-type/node_modules/webpack/lib/Compiler.js:461:20)
    at /Development/webpack-output-by-build-type/node_modules/webpack/lib/Compiler.js:220:10
    at Compiler.readRecords (/Development/webpack-output-by-build-type/node_modules/webpack/lib/Compiler.js:372:10)
    at /Development/webpack-output-by-build-type/node_modules/webpack/lib/Compiler.js:217:9
    at next (/Development/webpack-output-by-build-type/node_modules/tapable/lib/Tapable.js:138:11)
    at Compiler.compiler.plugin (/Development/webpack-output-by-build-type/node_modules/webpack/lib/CachePlugin.js:35:59)
    at Compiler.applyPluginsAsyncSeries (/Development/webpack-output-by-build-type/node_modules/tapable/lib/Tapable.js:142:13)
    at /Development/webpack-output-by-build-type/node_modules/webpack/lib/Compiler.js:214:8
    at next (/Development/webpack-output-by-build-type/node_modules/tapable/lib/Tapable.js:138:11)
    at Compiler.compiler.plugin (/Development/webpack-output-by-build-type/node_modules/webpack/lib/node/NodeEnvironmentPlugin.js:21:4)
    at Compiler.applyPluginsAsyncSeries (/Development/webpack-output-by-build-type/node_modules/tapable/lib/Tapable.js:142:13)
    at Compiler.run (/Development/webpack-output-by-build-type/node_modules/webpack/lib/Compiler.js:211:7)
    at processOptions (/Development/webpack-output-by-build-type/node_modules/webpack/bin/webpack.js:359:12)
    at Object.<anonymous> (/Development/webpack-output-by-build-type/node_modules/webpack/bin/webpack.js:363:1)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.runMain (module.js:605:10)
    at run (bootstrap_node.js:420:7)
    at startup (bootstrap_node.js:139:9)

If the current behavior is a bug, please provide the steps to reproduce.

Following gist has current package.json and webpack.config.js before migrating:
https://gist.github.com/jouni-kantola/2a63a054dbb6f60a5c36ce38913df4fc

What is the expected behavior?
Config:

{
    test: /\.js$/,
    exclude: /(node_modules)/,
    loader: 'babel-loader',
    query: {
        presets: ['env']
    }
}

Should migrate to:

{
    test: /\.js$/,
    exclude: /(node_modules)/,
    use: {
        loader: 'babel-loader',
        options: {
            presets: ['env']
        }
    }
}

Please mention other relevant information such as the browser version, Node.js version, Operating System and programming language.
OS: MacOS
Node: v7.4.0
Deps (after migrate):

  "devDependencies": {
    "autoprefixer": "^6.6.1",
    "babel-core": "^6.21.0",
    "babel-eslint": "^7.1.1",
    "babel-loader": "^6.2.10",
    "babel-preset-env": "^1.1.4",
    "css-loader": "^0.27.3",
    "eslint": "^3.13.0",
    "eslint-loader": "^1.6.1",
    "html-webpack-plugin": "^2.24.1",
    "less": "^2.7.1",
    "postcss-loader": "^1.2.1",
    "script-ext-html-webpack-plugin": "^1.4.0",
    "style-loader": "^0.14.1",
    "webpack": "^2.2.1",
    "webpack-chunk-hash": "^0.4.0",
    "webpack-cli": "https://github.com/webpack/webpack-cli.git#37a594d0346f51c5d62779f835e2293602359a5f",
    "webpack-dev-server": "^2.4.2",
    "webpack-manifest-plugin": "^1.1.0"
  }

AST Transform Bug

Source