🧩 Plasmo Developers

PD

🧩 Plasmo Developers

Join the community to ask questions about 🧩 Plasmo Developers and get answers from other members.

Join

👾extension

👟framework

🔰newbie

🦉pallas

Injecting both Emotion cache AND local css

Howdy, I am missing a piece in my understanding. I have added the MUI css using the following script: import createCache from "@emotion/cache"...

Typescript unions not working

Hi, I'm facing a weird issue with Typescript, I have created a state like this: ```jsx const [processing, setProcessing] = useState<boolean | null>(false)...
No description

Why do I keep getting the errors of `Uncaught Error: Extension context invalidated.` and `React.jsx`

Hi there. I noticed that whenever I refresh the extension or do anything to it, the following errors just keep popping up. Please help! For context, I have checked all the imports and exports in my React code and don't see the "mixed up default and named imports" error suggested. After getting stuck for days, I don't know what else I can do to get them resolved. ...
Solution:
Hi, if you are referring to the “Extension context invalidated”, this appears when you have a content script in the page and the background script was unloaded, this most often happens when you are using the ‘dev’ command which try to refresh the content scripts automatically. If you wish to not get those error anymore, there is a flag —no-cs-reload
No description

Messaging between two content scripts

Hi! How would I go on to send a message from one content script to another using Plasmo? The basic chrome.runtime doesn't work and the Plasmo messaging functionality seems to be working backend <-> CS but not between CS. E.g if I use sendToContentScript, I get a 'Error: Extension tabs API is not available' during runtime....
Solution:
If they're in the same world wouldn't they have access to each other? Could you use window.postMessage? https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

Losing styles when injecting popup component in CSUI

No matter if the CSUI is ```html <script context="moudule" lang="ts"> import Dashboard from "~popup.svelte"; </script>...
No description

Import a custom package styling (React-hot-toast)

Hi. I am trying to utilize the react-hot-toast package in my Plasmo content script. When importing into my React component, the basic functionality of the package works fine but all the design is gone. Is there a similar cache option for this (like MUI components have) or is there a way around it to get the package styling into CSUI? Thanks in advance!...

Anyone got devtools working with a React front end?

Struggling to get this working and would like some help.

Multiple Content Scripts on One Page Not Working As Expected

I have a project where I need to add two elements to a webpage. A button absolutely positioned / fixed on the right side of the screen. And then a button relatively positioned to another button already on the webpage. I approach it like this ```tsx...
No description

Fails to load source maps

Plasmo version: 0.83.0 I also tried removing .plasmo/, didn't help I'm on Edge on Windows 10...
No description

Plasmo adds <all_urls> content script automatically, triggering host permissions

Title. I have a contents directory with some content scripts, however the generated manifest.json also adds an additional content script:
{ "matches": ["<all_urls>"], "js": ["configs.9ddedc67.js"], "css": [] },
{ "matches": ["<all_urls>"], "js": ["configs.9ddedc67.js"], "css": [] },
...

Using NextJS API routes works in dev but not in prod

Hi folks, Thank you for building this awesome framework. I followed the next js example to get started. I was able to build a great extension (I think). I need to make outside API calls, so I created some API routes under /src/pages/api And I can call them by making an "internal API call" from the client GET $PLASMO_PUBLIC_NEXT_URL/api/something...

Plasmo's dev server doesn't always properly watch for file changes

Suppose I run plasmo dev --target=firefox-mv2 I tried to modify https://github.com/avi12/youtube-auto-hd/blob/main/src/popup/components/PromotionLinks.svelte but did not see any change in the dev server Plasmo version: 0.83.0...

Plasmo crashes when debugging on Firefox for Android

I'm trying to simultaneously run a Firefox debug session via web-ext run --target=firefox-android and run plasmo dev --target=firefox-mv2 When I modify a script, often I get: ``` Error: ENOENT: no such file or directory, unlink 'C:\repositories\extensions\youtube-auto-hd\build\firefox-mv2-de v\popup.2727c4f1.js.1756.2e'...

CSUI; can I reinject?

Alright, I'm pretty beginner at React & Plasmo, so apologize if I mess up some of my terminology here. My goal is to add custom buttons to the send window in the ChatGPT UI, and it actually worked pretty awesome first-try with Plasmo CSUI. I just exported my component as default and also exported getInlineAnchor(), and now my buttons appear each time I load the site. The issue is that, every time you change chats in the ChatGPT UI, the the element is replaced with a new one, so whenever I switch chats, my buttons disappear again. They obviously come back when the page refreshes, but refreshing each time is not ideal. Example video: https://share.cleanshot.com/vd6nQDPD...
Solution:
AFAIK you can't "reinject" CSUI Your best bet right now is it to inject the CSUI manually from a regular content script and have a listener (e.g. https://developer.mozilla.org/en-US/docs/Web/API/MutationObserver ) to know when to reinject...

Additional permissions for development vs production

Considering that I'm working on an ext that will also have a backend, it makes a lot of sense for Plasmo to automatically set the final host_permissions with the proper hostnames I.e. during development I will have ```json { "manifest": {...
Solution:
Nevermind, I figured that I can just do ```json { "manifest": { "host_permissions": ["$PLASMO_PUBLIC_SERVER_URL"]...

Persist config with some key in sync, and some keys in local

I would like to only persist in chrome sync some keys, and leave other persisted in local. How can I do this ?...

Segfault error when building

Hey @lab, I've had this error for the past 2 days. ```🔵 INFO | Loaded environment variables from: [] 🟡 0 | @plasmohq/parcel-transformer-manifest 🟡 1 | Adding icons...

Browsers support

Hi team, I want to know how many browser extension we can make with plasmo?

use with-vue template with element-plus as ui, package too big

Dear all, I create ext use the with-vue template and use element-plus as ui component,but when I call build,all the component from element-plus are build into the js file, it's so big, event if I just use el-button Is there a way just package the components i used? thanks....
No description

process.env is empty

I am using env vars I created //.env.development PLASMO_PUBLIC_WEB_SITE_URL=VALUE I can use this value in package.json but can't load anything in code. It's empty...
No description