diff --git a/lib/migrate/loaders/__snapshots__/loaders.test.js.snap b/lib/migrate/loaders/__snapshots__/loaders.test.js.snap index 4a54f71ec3d..7fa15906328 100644 --- a/lib/migrate/loaders/__snapshots__/loaders.test.js.snap +++ b/lib/migrate/loaders/__snapshots__/loaders.test.js.snap @@ -229,12 +229,14 @@ exports[`loaders transforms correctly using "loaders-7" data 1`] = ` { test: /\\\\.js$/, exclude: /(node_modules)/, + use: [{ - loader: 'babel-loader' - }], - options: { - presets: ['env'] - } + loader: 'babel-loader', + + options: { + presets: ['env'] + } + }] } ] } diff --git a/lib/migrate/loaders/__testfixtures__/loaders-9.input.js b/lib/migrate/loaders/__testfixtures__/loaders-9.input.js new file mode 100644 index 00000000000..0bf440bce28 --- /dev/null +++ b/lib/migrate/loaders/__testfixtures__/loaders-9.input.js @@ -0,0 +1,14 @@ +module.exports = { + module: { + loaders: [ + { + test: [/\.bmp$/, /\.gif$/, /\.jpe?g$/, /\.png$/], + loader: 'url-loader', + options: { + limit: 10000, + name: 'static/media/[name].[hash:8].[ext]' + } + } + ] + } +} diff --git a/lib/migrate/loaders/loaders.js b/lib/migrate/loaders/loaders.js index a2820068be7..23903f89ce4 100644 --- a/lib/migrate/loaders/loaders.js +++ b/lib/migrate/loaders/loaders.js @@ -319,13 +319,59 @@ module.exports = function(j, ast) { }); }); + /** + * + * Puts options object outside use object into use object + * + * @param {Node} p - object expression ast that has a key for either 'options' or 'use' + * @returns {Node} objectExpression - an use object expression ast containing the options and loader + */ + + const fitOptionsToUse = p => { + let options; + p.value.properties.forEach(prop => { + const keyName = prop.key.name; + if (keyName === "options") { + options = prop; + } + }); + + if (options) { + p.value.properties = p.value.properties.filter( + prop => prop.key.name !== "options" + ); + + p.value.properties.forEach(prop => { + const keyName = prop.key.name; + if (keyName === "use") { + prop.value.elements[0].properties.push(options); + } + }); + } + + return p; + }; + + /** + * Move `options` inside the Array of {Rule.Use} + * + * @returns {Node} ast - jscodeshift ast + */ + + const moveOptionsToUse = () => + ast + .find(j.ObjectExpression) + .filter(p => utils.findObjWithOneOfKeys(p, ["use"])) + .forEach(fitOptionsToUse); + const transforms = [ prepostLoaders, loadersToRules, loadersToArrayExpression, loaderWithQueryParam, loaderWithQueryProp, - addLoaderSuffix + addLoaderSuffix, + moveOptionsToUse ]; transforms.forEach(t => t());