I'm using web-ext to sign an addon but I'm always having the same error message:
A content script defined in the manifest could not be found.
Error: Content script defined in the manifest could not be found at "node_modules/jquery/dist/jquery.min.js".
I already tried to change the path in the manifest.json file with ./, like:
"content_scripts": [
{
"matches": ["*://*/*"],
"js": [
"./node_modules/jquery/dist/jquery.min.js"
]
}
]
But the message keeps appearing, and it ignores the ./ since the message keeps complaining about could not be found at "node_modules/....
Not sure if there is a way to clear the web-ext cache. Or what I'm doing wrong to include such scripts. It seems the problem is with node_modules scripts.
Thanks in advance.
Related
After running command ,,npm run lint" (lint stands for ,,next lint"), I get error.:
Failed to load config "next/core-web-vitals" to extend from.
Referenced from: /Users/filiptaticek/Desktop/.eslintrc.json
I don't have any .eslintrc.json file on my Desktop and I have this issue even when I make a new NextJS project.
I have .eslintrc.json in my directory with content:
{
"extends": "next/core-web-vitals"
}
And then .eslintrc.js with configuration for Eslint. Any thoughts how to repair it please? Nothing on Stack overflow did help.
The solution: The .eslintrc.json is hidden by default, since it starts with an dot. Due to this it is not visible on my desktop neither finder, but you have to delete and find it through command line.
I am setting up a new react with rails (learning) application but can't get past this error. I am using rails 6. I have webpacker installed and setup in my app.
I am getting error at this line in my application.html.erb
<%= javascript_pack_tag 'hello_react' %>
When i hit / i get this error:
Webpacker can't find hello_react.js in /Users/apple/www/projects/react/example/public/packs/manifest.json. Possible causes:
1. You want to set webpacker.yml value of compile to true for your environment
unless you are using the `webpack -w` or the webpack-dev-server.
2. webpack has not yet re-run to reflect updates.
3. You have misconfigured Webpacker's config/webpacker.yml file.
4. Your webpack configuration is not creating a manifest.
Your manifest contains:
{
"application.js": "/packs/js/application-3dd0dc24d9c39bc09227.js",
"application.js.map": "/packs/js/application-3dd0dc24d9c39bc09227.js.map",
"entrypoints": {
"application": {
"js": [
"/packs/js/application-3dd0dc24d9c39bc09227.js"
],
"js.map": [
"/packs/js/application-3dd0dc24d9c39bc09227.js.map"
]
}
}
}
Can someone please guide me on what i might be doing wrong? I have removed node_modules and re-installed webpack and yarn in my application but the error persists.
I would suggest to run bin/webpack-dev-server as described on the Rails Guide
I think your problem is a mapping problem that will be solve locally with this.
Do not forget add the requirement of hello_react.js on your packs folder in case you're using it.
I am trying to add accessibility to a large web application built with react and webpack. This requires going back to the source files from the app. Is there a way to see which file the code originally came from? Inspect element and view source are nice but I can't find the path to the source file where the code was generated from. Is there a way to do this in dev tools (chrome or firefox developer edition) or am I stuck with searching my entire project src folder for code that will point me to the file? It is a single page application so it is not as easy as checking the url.
EDIT: we also use babel
EDIT2: changed name to clarify I am looking for the original source code path to the file
for that you have to use .babelrc and add this line into file
"sourceMaps": true
after adding this in chrome > source tab it will show all the files with same name as code and the code also will be in es6 or above (same as what you write).
example config:
{
"presets": ["es2015"],
"plugins": [
"transform-object-rest-spread",
[
"import",
{
"libraryName": "lib",
"libraryDirectory": "./src"
}
],
["module-resolver", {
"root": ["./src"],
"alias": {
"database": "./src/database",
"localization": "./localization",
"utils": "./utils"
}
}]
],
"sourceMaps": true
}
Let me know if you have any other issue still.
For getting file path you can right click on the file title tab and click on "Reveal in sidetab"
if you want to open file just press cmd + p and search for file name there you will see 2 files with same name. you have to open one witch dont have webpack-internal prefixed.
Also you can open side tab and there you will find your same folder structure as you do have in your project. in webpack dir.
I'm encountering the Manifest file is missing or unreadable error when trying to load my unpacked Chrome extension. I'm building the extension as a react app, so the file structure looks like this:
I understand that the manifest.json needs to be in the root folder, not in public the way react usually lays it out. When I move it to the root however, it breaks the connection to app.js and my popup only loads index.html with none of the javascript connected.
This is how my manifest is laid out:
{
"manifest_version": 2,
"name": "My Extension",
"description": "This extension is a starting point to create a real Chrome extension",
"version": "0.0.1",
"browser_action": {
"default_popup": "index.html",
"default_title": "Open the popup"
},
"icons": {
"16": "/public/images/get_started16.png",
"48": "/public/images/get_started48.png",
"128": "/public/images/get_started128.png"
},
"permissions": [
]
}
Not sure if you've figured this one out already since its been awhile since someone answered, but once you are done, do npm run build. This should create your "build" which will have your manifest file, after that, load unpackaged "build" folder.
Hope this helps.
In Order to solve this issue :- Click on
Pack extension give a complete path Extension root directory click on Pack extension
Now click on Load extension.
you can see in your current folder two extra file generated on is .pem and .ctx file.
its working now
I am trying to use the .jsx file type and have created a custom .babelrc file as per the Next.js documentation (see below). https://github.com/zeit/next.js#customizing-babel-config
{
"plugins": [
["transform-react-jsx", {
"extensions": [".jsx"]
}]
],
"presets": [
"next/babel"
]
}
However with the above .babelrc file I receive the following error:
Can someone point me in the direction as to what I am doing wrong to get jsx files to load properly?
Cheers,
Stefan
Next.js has support for .jsx files out of the box. There should be no need to customize your .babelrc, so you can either use the default one or just delete it altogether.
Make sure you are running the latest version of Next.js, and possibly delete the node_modules and the .next folder in your project directory. Then install the dependencies again & build.