Hey all. Anyone know how to inject styles as a .css file to some webpage?

im rewriting some extension since we are going to mv3, also i decieded to use Plasmo framework for this, all cool i like it so far but im not sure where to put my files so they get bundled in final code. I have this .css file that im trying to inject when website loads. const insertCSSRule = async (request, sender) => { return chrome.scripting.insertCSS({ target: { tabId: sender.tab.id }, files: [../rules/website.css], }). catch(console.error); } and but this gets me Error: Could not load file: '../rules/website.css'. i also tried ./rules/website.css, rules/website.css ./website.css, website.css while file is in rules folder or in assets, i even tried moving entire rules in assets but nothing seems to work.
Sam
Sam•22d ago
Do you possibly need to add web_accessible_resources to your manifest? I beleive that when you import static assets from ./assets plasmo does this for you. Since you're not importing the asset VIA something like import websiteCSS from 'url:~assets/website.css; it's not getting added to the manifest. I think if you add the import like that it will get you the fully qualified URL and add the files to the web_accessible_resources. I did this all within a CSUI file which had the PlasmoCSConfig with the matches property Best thing to do is to dig into the build folder output. Do you see the file you expect? Is it in the manifest? If not then thats the first problem.
ng_xyz
ng_xyz•11d ago
yea it was something with paths, i moved to tilda instead of dot one and it worked, i also did bunch of things with matches
Want results from more Discord servers?
Add your server
More Posts
How to inject React component on page?Hi I want to render an icon next to a div on the webpage and when that icon is clicked I want to renremount csui on url changei have built an extension using plasmo which injects some ui into the dom using getRootContainer thelocal storage dev tools plasmoHi all, I am trying to locate the storage api data. I am aware the data is stored in chrome.storageIs there something special you need to do to get a side panel to refresh on changes?Is there something special you need to do to get a side panel to refresh on changes? If I load and plasmo build --zip vs web-ext buildWhat's the difference? https://extensionworkshop.com/documentation/develop/web-ext-command-referenceUsing microphone in sidepanelHello, I am using Plasmo to build our extension. I was able to record microphone using a content scrFloating-ui with plasmo?Anyone managed to use floating-ui with Plasmo? I have been trying to inject a floating modal that caExtension rejected by Google due to RHC violation in Firebase AuthWe have been building an extension which uses Firebase ecosystem. Recently we tried submitting the eCSUI - detecting container removal ?Hey! I use a content script for CSUI and can successfully add my UI. Up to the use case of my app thenv variables in BGSW?Is there a way to access a non-public .env in background service workers akin to server-side in Nextrun content script after click on elementI want to run certain content scripts after the user clicks on a an element. I read the documentatioTailwind stops hot reloadingWhen I change styles in the project created with the tailwind template: `pnpm create plasmo --with-twith-firebase example giving chrome web store violation.Hey everyone, firstly huge thanks to plasmo trying to making developing web extensions more bearableHow to setup google analytics with plasmo react chrome extension in manifest v3and not have it be rejected by the CWS because of remote code? Which setup between those 2 examples