Best practice for including images?

There's two ways to include images:
1) Include it in /static and reference it directly
2) Include it in the component and use require (which embeds it as a data:uri).

In the former, I'd get the benefit of caching, but on the other hand, if I replace a file, it seems like it would still be cached by the browser (can't see that webpack is doing the type of renaming with has that grunt does)

In the latter, I won't get stale files but the data:uri will bloat my response (especially if an image is repeated) and I won't get any benefit of caching.

Advice?