how to solve svg path stoke width different thickness

I have a square hexagonal svg image, and i set stroke-width 4px for it. But the stroke thickness is not consistent, the vertical lines are thinner and开发者_如何学JAVA the slanted lines are thicker.

demo image

<svg width="173" height="199" viewBox="0 0 173 199" fill="none" xmlns="http://www.w3.org/2000/svg">
      <path stroke='#5088ff' stroke-width="4px" vector-effect="non-scaling-stroke" stroke-linecap="square" d="M86.5 0L173 50V150L86.5 199L0 150V50L86.5 0Z"/>
</svg>

I have searched and tried vector-effect="non-scaling-stroke", it does't work.