How to add CSS styles from a file in a browser extension to a website?

Question

Browser extensions

The extension may have a different address. It can either be connected as unpacked or from the store. So inserting a style element with a link will fail.
Just send the text and drive it into innerHTML - such a solution. Is there a prettier option?

Answer 1

It can either be connected as unpacked or from the store.

So what? The principle is the same.
Getting a link to a file using chrome.runtime.getURL('style.css'). The path is specified from the root of the extension directory.
And inject to the page:

injectCSSToPage (codeOrUrl, inline = true) {
  if (inline) {
    const style = document.createElement('style');
    style.textContent = codeOrUrl;
    document.head.appendChild(style);
  } else {
    const link = document.createElement('link');
    link.href = codeOrUrl;
    link.rel = 'stylesheet';
    document.head.appendChild(link);
  }
}