You need to take name as key.

const
    array = [{ name: 'width', value: 10 }, { name: 'height', value: 20 }],
    result = array.reduce(
        (object, { name, value }) => ({ ...object, [name]: value }),
        {}
    );

console.log(result);

reduce method executes a callback function on each element of the array, so in your issue, on every iteration you have an object that contains name and value property. you can achieve your goal like this:

let arr = [
 {name: 'width', value: 10}, 
 {name: 'height', value: 20}, 
]

let result = arr.reduce((ack, item)=>{
  ack[item.name] = item.value
  return ack
},{})

console.log(result);

Maybe I don't understand how .reduce() works a 100%?

Appears so. Read the docs

Every time the reducer function is called - ack is what was returned last time from the reducer (or the initial value if it's the first pass) and item is the current item.

It helps to do this:

arr.reduce((ack, item)=>{
  console.log(ack); // this will help you understand
  ack[item.name] = ack[item.value]
  return ack
},{})