plasmo icon indicating copy to clipboard operation
plasmo copied to clipboard

getStyle: PlasmoGetStyle api unable to get live-reload effect.

Open deng232 opened this issue 1 year ago • 3 comments

content.tsx:

import styleText from  "data-text:./styles.css"
import type { PlasmoGetStyle } from "plasmo"
function Overlay(){
    return (
        <div className="overlay">
                Test
        </div>
    )
}
export const getStyle: PlasmoGetStyle = () => {
    const style = document.createElement("style")
    style.textContent = styleText
    return style
  }

export default Overlay

when styles.css update, there is extension re-packaged message show, but no effect on "overlay" unless reload extension.

Version

Latest

What OS are you seeing the problem on?

Windows

What browsers are you seeing the problem on?

Chrome

Relevant log output

No response

(OPTIONAL) Contribution

  • [ ] I would like to fix this BUG via a PR

Code of Conduct

  • [X] I agree to follow this project's Code of Conduct
  • [X] I checked the current issues for duplicate problems.

deng232 avatar Apr 18 '24 02:04 deng232

Facing same issue... Also for content scripts there is no HMR, the whole page just reload (and the extension as well)

Changing CSS/SCSS does not trigger the reload.

I belive related: https://github.com/PlasmoHQ/plasmo/issues/610#issuecomment-1579781474

Jonathan-Asher avatar May 01 '24 16:05 Jonathan-Asher

Started using Tailwind CSS for the hot reloading!

Jonathan-Asher avatar May 01 '24 17:05 Jonathan-Asher

@Jonathan-Asher Would you mind detailing a bit of your process? I'd love to get some sort of HMR running for styles, and I've run into this same issue.

HeathStratosphere avatar Aug 23 '24 03:08 HeathStratosphere