PD
🧩 Plasmo Developersviktassen
MUI styles with PlasmoGetInlineAnchorList
Styles are added only for last shadow-root.
Please tell me how to make it work.
// Plasmo
import createCache from "@emotion/cache";
import { CacheProvider } from "@emotion/react";
import { Button } from "@mui/material";
import type { PlasmoCSConfig, PlasmoGetInlineAnchorList } from "plasmo"
export const config: PlasmoCSConfig = {
matches: ["https://plasmo.com/*"],
};
export const getInlineAnchorList: PlasmoGetInlineAnchorList = async () => {
const anchors = document.querySelectorAll(".myClass")
return Array.from(anchors).map((element) => ({
element,
insertPosition: "beforeend",
}))
};
const styleElement = document.createElement("style")
const styleCache = createCache({
key: "plasmo-mui-cache",
prepend: true,
container: styleElement
})
export const getStyle = () => styleElement const MyButton = () => {
return ( <CacheProvider value={styleCache}> <Button> My Button </Button> </CacheProvider> ) } export default MyButton
export const getStyle = () => styleElement const MyButton = () => {
return ( <CacheProvider value={styleCache}> <Button> My Button </Button> </CacheProvider> ) } export default MyButton
viktassen•62d ago
const MyButton = ({ anchor }) => {
const styleCache = createCache({
key: "plasmo-mui-cache",
prepend: true,
container: anchor.element.querySelector('plasmo-csui').shadowRoot,
})
Works for me, don't know if it is a best solution
2.1KMembers
View on DiscordWant results from more Discord servers?
More PostsTypescript ConfusionI am working on a very simple extension that collects some data off the page and stores it locally. Proxy authentication and API calls afterwardHello, guys. I'm starting to give up.
I'm developing proxy extension and proxying works okay. But how do you get a privacy policy when uploading to chrome web store?Most generators that I have searched for online require a link to your website to put in, but since await not definedhey! just trying out the basic extension framework using `create plasmo`. had the basics working, buLogging user errorsAnyone have any suggestions on any libraries or strategies that you use to log errors coming from usNo styling for options.tsxI have a basic options page written in TypeScript and styled via Tailwind CSS that displays perfectl