search

lxieyang / chrome-extension-boilerplate-react

A Chrome Extensions boilerplate using React 18 and Webpack 5.
MIT License
3.42k stars 1.07k forks source link

Importing images into the content script #183

Open dpw1 opened 1 year ago

dpw1 commented 1 year ago

Hello,

Firstly thank you very much for the excellent work! Is there anyway I can import images into my content script? I have tried it like this:

import logo from '../../../assets/img/icon-128.png';

But it doesn't work. Any help is greatly appreciated. Thanks!

thatBrian commented 4 months ago

Did some soul searching and came up with this.

import icon from '../../../assets/test.jpg';
const container = document.createElement("div")
container.className = "charlie";
container.style.backgroundImage = `url('${chrome.runtime.getURL(icon)}')`;

But running into the issue with web_accessible_resources

thatBrian commented 4 months ago

Fixed the web_accessible_resource issue by updating the manifest.json file. https://github.com/GoogleChrome/developer.chrome.com/issues/544#issuecomment-806260538