A chrome extension I have been working on runs fine on firefox but whenever I try and run it on chrome, webpack style-loader throws this error:
Couldn't find a style target. This probably means that the value for the 'insertInto' parameter is invalid.
Once I remove the css imports, the extension will run but I need the css for the extension.
For some reason, if you specify in your manifest that your extension should run at document_start:
"content_scripts": [
{
"run_at": "document_start",
"matches": // ...
"js": // ...
}
],
On firefox this will run after the <head> has been constructed and so style-loader will successfully inject the styles. But, as per Chrome's documentation, document_start will inject
"before any other DOM is constructed or any other script is run."
So I think the style-loader fails to inject the css into the <head> on chrome because at document start it hasn't been constructed yet.
TL;DR: Change "document_start" to "document_idle":
{
"name": "My extension",
...
"content_scripts": [
{
"matches": ["http://*.nytimes.com/*"],
"run_at": "document_idle",
"js": ["contentScript.js"]
}
],
...
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With