Как бы вы сделали svg иконки в проекте?
Мы вставляем иконки в разметку, не подключая из стороннего файла, как делает, например, гитхаб: https://github.blog/2016-02-22-delivering-octicons...

Для posthtml вот такой плагин есть: https://github.com/andrey-hohlov/posthtml-inline-svg

Про градиенты тут хорошо расписано https://fvsch.com/svg-gradient-fill/ , мне нравится вариант с fill: url...  в css.
Все верно, через символьные ссылки вставлять иконки самое удобное. Но при этом надо следить чтоб id градиентов и прочих элементов не пересекались с другими. Иначе получишь непонятные вещи. Ну а корень твоей проблемы исходит из fill="none", который говорит - "ничего не заливать", а градиент добавляется через заливку.