Cannot find module'@prisma/client' after electron builder build the app

[CalsRanna]

Hi, I met a problem and I don't know how to solve it. SO I start this discussion to seek help.

I use Vite and electron to build an app to do some database work, and when I use pnpm serve in develop environment, the app runs well and no even warnings happen. But when I package it, it always say "Cannot find module '@prisma/client'", and I even don't know what make it happens, pnpm? Vite? Or electron-builder.

Here's Vite config.

// vite.main.config.ts

import { builtinModules } from "module";
import { join } from "path";
import { defineConfig } from "vite";

export default defineConfig({
  mode: process.env.NODE_ENV,
  root: join(__dirname, "../src/main"),
  build: {
    outDir: "../../dist/main",
    lib: {
      entry: "index.ts",
      formats: ["cjs"],
    },
    sourcemap: true,
    minify: true,
    emptyOutDir: true,
    rollupOptions: {
      external: [...builtinModules, "electron"],
      output: {
        entryFileNames: "[name].cjs",
      },
    },
  },
});

Here's electron builder config.

// electron-builder.config.js

export default {
  appId: "com.example.calsranna",
  asar: true,
  directories: {
    output: "release/${version}",
  },
  files: ["!node_modules", "dist", "package.json"],
  mac: {
    artifactName: "${productName}_${version}.${ext}",
    target: ["dmg"],
  },
  win: {
    artifactName: "${productName}_${version}.${ext}",
    target: [
      {
        target: "nsis",
        arch: ["x64"],
      },
    ],
  },
  nsis: {
    oneClick: false,
    perMachine: false,
    allowToChangeInstallationDirectory: true,
    deleteAppDataOnUninstall: false,
  },
};

And here's the package.json

{
  "name": "my-app",
  "version": "1.0.0",
  "main": "dist/main/index.cjs",
  "author": "Cals Ranna",
  "license": "MIT",
  "engines": {
    "node": "17.0.1"
  },
  "scripts": {
    "model": "node script/model.mjs",
    "serve": "node script/serve.mjs",
    "build": "node script/build.mjs"
  },
  "dependencies": {
    "@element-plus/icons": "^0.0.11",
    "@prisma/client": "^3.6.0",
    "axios": "^0.24.0",
    "change-case": "^4.1.2",
    "element-plus": "^1.2.0-beta.4",
    "vue": "^3.2.23",
    "vue-i18n": "^9.2.0-beta.22",
    "vue-router": "^4.0.12",
    "vuex": "^4.0.2"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^1.10.1",
    "chalk": "5",
    "electron": "^16.0.3",
    "electron-builder": "^22.14.5",
    "minimist": "^1.2.5",
    "prisma": "^3.6.0",
    "typescript": "^4.5.2",
    "vite": "^2.6.14"
  }
}

I try something to solve it, like add 'extraResource' to electron-builder or 'asar: false', but it didn't work. So what should I do?

[TasinIshmam]

Hey @CalsRanna,

I faced a similar issue when using electron-builder and I was able to solve it by keeping everything prisma client related in extraResources. I see that you tried this, I was wondering if you could share the configuration you used in your attempt?

In my case, what I did is shown in this repo, with the electron builder config located in package.json. Perhaps it might work for you.

[igolka97]

Thanks for your example project!

[Ipicon]

Thank you!
was on this for couple hours, I knew the general direction to fix it, but you pinpointed it for me!

[luigi-raynel-dev]

For those using webpack, a simpler solution is to add in your package.json on build:

"extraResources": [
    {
      "from": "./node_modules/.prisma",
      "to": "../.prisma/"
    }
  ]

Remember to run prisma generate first.

[Evilu]

how can you run a cli command in a built app?

[Ipicon]

you run it before running the build command, in your dev environment

[Evilu]

Thanks, i had a confusing weekend, summarized it here with solution to the problems:
#21027