alex8088 / electron-vite

Next generation Electron build tooling based on Vite 新一代 Electron 开发构建工具,支持源代码保护
https://electron-vite.org
MIT License
3.29k stars 141 forks source link

Electron-Store return error if < bytecodePlugin > is enabled in < electron.vite.config.ts > #568

Closed Tokkkyo closed 2 months ago

Tokkkyo commented 2 months ago

Describe the bug

Inside electron.vite.config.ts i have a classic configuration, and i enable bytecodePlugin() :

import { defineConfig, externalizeDepsPlugin, bytecodePlugin } from 'electron-vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  main: {
    plugins: [externalizeDepsPlugin(), bytecodePlugin()]
  },
  preload: {
    plugins: [externalizeDepsPlugin(), bytecodePlugin()]
  },
  renderer: {
    resolve: {
      alias: {...}
    },
    plugins: [react()],
  }
})

But when i start the app on preview: npm run start i got an error: TypeError: Cannot read properties of undefined (reading 'store')

This error happen ONLY when bytecodePlugin is enable. I want to fixe with exclude:

  main: {
    plugins: [
      externalizeDepsPlugin(),
      bytecodePlugin({
        exclude: ['electron-store']
      })
    ]
  },
  preload: {
    plugins: [
      externalizeDepsPlugin(),
      bytecodePlugin({
        exclude: ['electron-store']
      })
    ]
  }

But exlude dos'nt exist on BytecodeOptions.

Store IPC init:

    /**
     * Electron Store IPC Events
     * @param {string} key
     * @param {any} property
     */
    ipcMain.handle('electron-store-get', async (_event, key) => {
      return (store as any).get(key)
    })

    ipcMain.handle('electron-store-set', async (_event, property, val) => {
      ;(store as any).set(property, val)
      return (store as any).get(property)
    })

    ipcMain.handle('electron-store-delete', async (_event, key) => {
      ;(store as any).delete(key as string)
    })

    ipcMain.handle('electron-store-clear', async (_event) => {
      ;(store as any).clear()
    })

I use older version of electron-store: "electron-store": "^8.2.0",

Electron-Vite Version

^2.3.0

Electron Version

^31.0.2

Vite Version

^5.3.1

Validations

alex8088 commented 2 months ago

https://electron-vite.org/guide/dev#dependencies-vs-devdependencies

it should be installed in dependencies.

Tokkkyo commented 2 months ago
  "dependencies": {
    "@electron-toolkit/preload": "^3.0.1",
    "@electron-toolkit/utils": "^3.0.0",
    "@react-spring/web": "^9.7.3",
    "@react-three/drei": "^9.108.4",
    "@react-three/fiber": "^8.16.8",
    "@tabler/icons-sprite": "^3.10.0",
    "@types/react-beautiful-dnd": "^13.1.8",
    "@types/three": "^0.166.0",
    "axios": "^1.7.2",
    "bytenode": "^1.5.6", <-- ADDED
    "classnames": "^2.5.1",
    "discord-rpc": "^4.0.1",
    "dotenv-safe": "^9.1.0",
    "draco3d": "^1.5.7",
    "electron-log": "^5.1.5",
    "electron-store": "^8.2.0",
    "electron-updater": "^6.1.7",
    "fs-extra": "^11.2.0",
    "gsap": "^3.12.5",
    "i18next": "^23.12.1",
    "i18next-browser-languagedetector": "^8.0.0",
    "i18next-electron-fs-backend": "^3.0.2",
    "i18next-http-backend": "^2.5.2",
    "jwt-decode": "^4.0.0",
    "posthog-js": "^1.147.0",
    "react-beautiful-dnd": "^13.1.1",
    "react-i18next": "^14.1.3",
    "three": "^0.166.1"
  },
  "devDependencies": {
    "@electron-toolkit/eslint-config-prettier": "^2.0.0",
    "@electron-toolkit/eslint-config-ts": "^2.0.0",
    "@electron-toolkit/tsconfig": "^1.0.1",
    "@types/discord-rpc": "^4.0.8",
    "@types/node": "^20.14.8",
    "@types/react": "^18.3.3",
    "@types/react-dom": "^18.3.0",
    "@vitejs/plugin-react": "^4.3.1",
    "electron": "^31.0.2",
    "electron-builder": "^24.13.3",
    "electron-vite": "^2.3.0",
    "eslint": "^8.57.0",
    "eslint-plugin-react": "^7.34.3",
    "prettier": "^3.3.2",
    "react": "^18.3.1",
    "react-dom": "^18.3.1",
    "typescript": "^5.5.2",
    "vite": "^5.3.1"
  }

Still errored, store is undefined still

alex8088 commented 2 months ago

How do you import and use the electron store. I think it's a code problem and the error message is very clear.

there is no need for byteNode.

for example : https://github.com/alex8088/EvPlayer

Tokkkyo commented 2 months ago

Very strange, when i npm run dev / start or event build, without bytenodePlugin, all is fine, store work. But soon as i enable bytenodePlugin, store dosn't work anymore.

"electron-store": "^8.2.0"

import Store from 'electron-store'
const store = new Store()

    ipcMain.handle('electron-store-get', async (_event, key) => {
      return store.get(key)
    })

    ipcMain.handle('electron-store-set', async (_event, property, val) => {
      store.set(property, val)
      return store.get(property)
    })

    ipcMain.handle('electron-store-delete', async (_event, key) => {
      store.delete(key)
    })

    ipcMain.handle('electron-store-clear', async (_event) => {
      store.clear()
    })

This is the only code i have related to electron-store, again, it work in dev/preview/ AND production , but without bytenode, sorry for taking your time Alex. I will make more test

alex8088 commented 2 months ago

https://github.com/alex8088/electron-conf recommend electron-conf