首页 > 解决方案 > Webpack-merge 和 Object.assign() 有什么区别?

问题描述

我正在使用 webpack,最后我看不到这个包的机会,因为它似乎 Object.assign 完成了这项工作,但也许关于这个包的字里行间有什么东西?

谢谢

标签: javascriptwebpack

解决方案


“webpack-merge” npm 包和 Object.assign()(或对象扩展)之间的区别在于它们如何处理具有相同名称的属性:

const webpackMerge = require("webpack-merge");

const object1 = {
  'x': [{'a': 'a' }, { 'b': 'b' }]
}

const object2 = {
  'x': [{'c': 'c' }, { 'd': 'd' }]
}

console.log('result webpackMerge: ',
  webpackMerge(object1, object2)
)

console.log('result Object.assign: ',
  Object.assign({}, object1, object2)
)

console.log('result Object.spread: ',
  {...object1, ...object2}
)

以上将为您提供:

result webpackMerge:  { x: [ { a: 'a' }, { b: 'b' }, { c: 'c' }, { d: 'd' } ] }
result Object.assign:  { x: [ { c: 'c' }, { d: 'd' } ] }
result Object spread:  { x: [ { c: 'c' }, { d: 'd' } ] }

正如您在上面看到的 Object.assign() (或 Object spread)用后一个属性覆盖先前属性的值,而 webpack-merge 连接数组的元素。

在 Runkit 中查看上面的代码


推荐阅读