Devtools can't open on Electron

[major697]

I have app in Electron, Vite and Vue3.

node: v20.11.1
npm: 10.2.4
MacOS: 14.4 (23E214)

This is my dependencies:

"dependencies": {
    "axios": "^1.6.7",
    "dayjs": "^1.11.10",
    "dotenv": "^16.4.5",
    "electron-log": "^5.1.1",
    "electron-updater": "^6.1.8",
    "jwt-decode": "^4.0.0",
    "node-machine-id": "^1.1.12",
    "pinia": "^2.1.7",
    "socket.io-client": "^4.7.4",
    "vue": "^3.4.21",
    "vue-router": "^4.3.0"
  },
  "devDependencies": {
    "@types/node": "^20.11.25",
    "@typescript-eslint/eslint-plugin": "^7.1.1",
    "@typescript-eslint/parser": "^7.1.1",
    "@vitejs/plugin-vue": "^5.0.4",
    "@vue/eslint-config-prettier": "^9.0.0",
    "@vue/eslint-config-typescript": "^12.0.0",
    "autoprefixer": "^10.4.18",
    "electron": "^29.1.0",
    "electron-builder": "^24.13.3",
    "eslint": "^8.57.0",
    "eslint-plugin-prettier": "^5.1.3",
    "eslint-plugin-vue": "^9.22.0",
    "husky": "^9.0.11",
    "lint-staged": "^15.2.2",
    "postcss": "^8.4.35",
    "prettier": "^3.2.5",
    "sass": "^1.71.1",
    "tailwindcss": "^3.4.1",
    "typescript": "^5.3.3",
    "vite": "^5.1.5",
    "vite-plugin-electron": "^0.28.2",
    "vite-plugin-electron-renderer": "^0.14.5",
    "vite-plugin-vue-devtools": "^7.0.16",
    "vue-tsc": "^2.0.5"
  },
  "overrides": {
    "vite-plugin-electron": {
      "electron": "$electron"
    }
  }

When I try open Devtools, I have an error in console:
EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self' 'unsafe-inline'".

Inside index.html file I have:
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-inline';" />
Whe I change this to this:
<meta http-equiv="Content-Security-Policy" content="script-src 'self' 'unsafe-eval';" />

The Electorn return error:
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-eval'". Either the 'unsafe-inline' keyword, a hash ('sha256-oQFZCLbDrsnK+JwZN6u488PGfhj52jozs93UXp01Puo='), or a nonce ('nonce-...') is required to enable inline execution.

I back to 7.0.15, but still I have this same errors.

[webfansplz]

Can you provide a mini repo? thanks 🙏

[alexzhang1030]

Related #265

#268 fixed this issue, you can try again after it is published.

[webfansplz]

Related #265

#268 fixed this issue, you can try again after it is published.

I also think this is the reason, so I think if we still have this issue in v7.0.15, we need a reproduction @major697 .

[webfansplz]

@major697 Hi, can you upgrade to the latest version and try again?

[major697]

I have updated to the latest version (7.0.20). Works fine, thanks!