Can I preload a full javascript library in electron.js and use it on the client side?-CodePudding

I'm creating an Electron.js project. I've added some npm packages for my project. Most of these are for the index.html. E.g. I've intalled vis-network (graphics js lib) for showing graphs. How can I preload these propely and use the libraries on the browser side? Or is there any other useful method to use npm packages on the browser side in Electron?

preload.js

const { contextBridge } = require("electron")
const { vis } = require("vis-network")

const attachedLibraries = {
    libVis : vis
}

contextBridge.exposeInIsolatedWorld("attachedLibraries", attachedLibraries)

main.js

const createWindow = () => {
  const win = new BrowserWindow({
    width: 800,
    height: 600,
    webPreferences: {
      nodeIntegration: true,
      preload : 'preload.js'
    }
  })

  win.loadFile('view/index.html')
}

npm package in node_modules

CodePudding user response：

You can use the package electron-vite to do this! There are other options (like webpack as well), but this one is pretty well documented, particularly how they structure preload scripts.