home.sgr

extends(src='layout.sgr')

  block(name='styles' type='append')
    // normal link
    link(rel='stylesheet' href='/css/home-hero.css')
    
    // function for reshape-content
    style(inline) /css/home-hero.css
    
    // reshape custom element plugin
    // - url via src attribute
    style-inline(src='/css/home-hero.css')
    // - url via text content
    style-inline /css/home-hero.css

  block(name='content')
    p Here is my content

reshape-style-inline.js

const {modifyNodes} = require('reshape-plugin-util')
const fs = require('fs')

module.exports = function reshapeStyleInline (options = {}) {
  return function (tree) {
    return modifyNodes(tree, (node) => {
      return (node.type === 'tag' && node.name === 'style-inline')
    }, (node) => {
      // you obviously need to translate src='/css/home-whatever.css' to actual path
      const src = magicalGetToFileFunction(node.attrs.src)
      node.content = [{type:'text', content: [src]}]
      return node
    })
  }
}