question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Allow appending objects in `mergeWithRules`

See original GitHub issue

Consider the following example:

const a = {
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [{ loader: "style-loader", options: { someOption: true } }, { loader: "sass-loader" }],
      },
    ],
  },
};
const b = {
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [
          {
            loader: "style-loader",
            options: {
              modules: true,
            },
          },
        ],
      },
    ],
  },
};
const result = {
  module: {
    rules: [
      {
        test: /\.css$/,
        use: [
          {
            loader: "style-loader",
            options: {
              someOptions: true,
              modules: true,
            },
          },
          { loader: "sass-loader" },
        ],
      },
    ],
  },
};

assert.deepStrictEqual(
  mergeWithRules({
    module: {
      rules: {
        test: "match",
        use: {
          loader: "match",
          options: "append",
        },
      },
    },
  })(a, b),
  result
);

Currently this will fail, since append only supports arrays. However, merging loaders options is a perfectly valid scenario and should be pretty easy to support.
Any chance we can get that?

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:6 (6 by maintainers)

github_iconTop GitHub Comments

1reaction
bebrawcommented, Dec 10, 2020

Also would be nice to get proper exception for certain option not being allowed for objects/arrays. Today if I use append on object I’d get “concat is not a function".

Yeah, I can add a type check and throw for sure.

0reactions
bebrawcommented, Dec 12, 2020

I understand. Instead of type checking Webpack types though you could check for object/array. Regardless of the application (whether you merge webpack config or something else) you can limit the append/prepend to arrays only and merge to objects only. This way you’ll have proper warnings/errors while avoiding things like “concat is not a function”. And it also will be pretty easy to document. WDYT?

Yeah, I see what you mean now. I added simple type checks to guard against append/prepend/merge. I think that covers it well and now it’s easier to notice if you are trying to merge types that the system doesn’t expect.

If you notice missing checks, open separate issues with small test cases for them and I’ll add logic based on that.

Read more comments on GitHub >

github_iconTop Results From Across the Web

webpack-merge | Yarn - Package Manager
webpack-merge provides a merge function that concatenates arrays and merges objects creating a new object. If functions are encountered, it will execute ...
Read more >
webpack-merge/CHANGELOG.md - UNPKG
10, - Fix - Don't merge strings with objects in `mergeWithRules`. #172 ... 34, - Feat - Allow `mergeWithRules` to merge based on...
Read more >
webpack-merge - npm
webpack-merge provides a merge function that concatenates arrays and merges objects creating a new object. If functions are encountered, ...
Read more >
Merge nested objects in JavaScript, and append matching ...
This is a good opportunity to show off the neat javascript spread syntax, Array and Object prototype functions, and destructuring patterns.
Read more >
create-single-spa
yarn add --dev webpack-config-single-spa webpack-merge ... modify the webpack config however you'd like to by adding to this object
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found