0

I am trying to import a CSS file in the content script of a browser extension, but the content script doesn't get executed anymore when the import is added.

My popup also imports a file App.css and works fine, but when I try to do the exact same in the content script, I don't get any errors but the content script doesn't run anymore at all.

The CSS-part of my Webpack-config looks like this

{
   test: /\.css$/,
   use: ['style-loader', 'css-loader', 'postcss-loader'],
   exclude: /\.module\.css$/,
},

and I don't understand why the CSS-import is working fine in the popup, but not in the content script. (I need postcss because I want to use Tailwind, but the import doesn't work even with "normal" CSS)

I know that I can specify a css property in the manifest for content-scripts, but I guess this wouldn't work if I want to use Tailwind, because Webpack doesn't generate a CSS-file.

Nils
  • 84
  • 2
  • 9
  • For complex UI it's better to put it inside a [special iframe](https://stackoverflow.com/a/25100953/) pointing to an html file that you'll build the same way as the popup. – wOxxOm Mar 30 '22 at 05:55

0 Answers0