Only Redux Devtool Shows

[mustafaabobakr]

It was Required to remove _meta folder and modify manifest.json, To Add the extensions without errors!

• Deleted _metadata folder
• Modified the manifest.json of React

manifest.json

{
  "manifest_version": 2,
  "name": "React Developer Tools",
  "description": "Adds React debugging tools to the Chrome Developer Tools.\n\nCreated from revision 11a2ae3a0d on 11/12/2020.",
  "version": "4.10.0",
  "version_name": "4.10.0 (11/12/2020)",
  "icons": {
    "16": "icons/16-production.png",
    "32": "icons/32-production.png",
    "48": "icons/48-production.png",
    "128": "icons/128-production.png"
  },
  "devtools_page": "main.html",
  "content_security_policy": "script-src 'self' 'unsafe-eval'; object-src 'self'",
  "web_accessible_resources": [
    "main.html",
    "panel.html",
    "build/react_devtools_backend.js",
    "build/renderer.js"
  ],
  "background": {
    "scripts": [
      "build/background.js"
    ],
    "persistent": false
  },
  "permissions": [
    "file:///*",
    "http://*/*",
    "https://*/*"
  ],
  "content_scripts": [
    {
      "matches": [
        "<all_urls>"
      ],
      "js": [
        "build/injectGlobalHook.js"
      ],
      "run_at": "document_start"
    }
  ]
}

  "dependencies": {
    "axios": "^0.21.0",
    "cheerio": "^1.0.0-rc.3",
    "chrome-paths": "^1.0.1",
    "cross-fetch": "^3.0.6",
    "electron-titlebar-windows": "^3.0.0",
    "electron-updater": "^4.3.5",
    "electron-window-state": "^5.0.3",
    "ffprobe": "^1.1.2",
    "ffprobe-static": "^3.0.0",
    "node-sass": "4.14.1",
    "puppeteer": "^5.5.0",
    "puppeteer-core": "^5.5.0",
    "puppeteer-extra": "^3.1.15",
    "puppeteer-extra-plugin-adblocker": "^2.11.8",
    "puppeteer-extra-plugin-block-resources": "^2.2.7",
    "puppeteer-extra-plugin-stealth": "^2.6.5",
    "puppeteer-in-electron": "^3.0.3",
    "utf8": "^3.0.0",
    "v8-compile-cache": "^2.2.0"
  },
  "devDependencies": {
    "@material-ui/core": "^4.11.0",
    "@material-ui/icons": "^4.9.1",
    "@material-ui/lab": "4.0.0-alpha.56",
    "@welldone-software/why-did-you-render": "6.0.0-rc.1",
    "concurrently": "^5.3.0",
    "cross-env": "^7.0.2",
    "electron": "^11.0.2",
    "electron-builder": "^22.9.1",
    "electron-devtools-installer": "^3.1.1",
    "electron-is-dev": "^1.2.0",
    "electron-reload": "^1.5.0",
    "nodemon": "^2.0.6",
    "plyr": "^3.6.3",
    "react": "^17.0.1",
    "react-detect-offline": "^2.4.0",
    "react-dom": "^17.0.1",
    "react-router": "^5.2.0",
    "react-router-dom": "^5.2.0",
    "react-scripts": "^4.0.0",
    "wait-on": "^5.2.0"
  },

[sahilshahane]

Encountered Same Issue

[leohxj]

maybe you use file protocol because:

Download the React DevTools for a better development experience: https://reactjs.org/link/react-devtoolsYou might need to use a local HTTP server (instead of file://): https://reactjs.org/link/react-devtools-faq

[AlexandreKilian]

Any solutions for this? I don't have a manifest.json nor a _meta folder

[jamesmontalvo3]

Per https://github.com/electron/electron/issues/23662 and https://github.com/electron/electron/pull/25198, you need to add allowFileAccess option in newer versions of Electron, e.g.:

installExtension(
	REACT_DEVELOPER_TOOLS,
	{ loadExtensionOptions: { allowFileAccess: true } }
);