Quasar: Electron: In preloader, require is not defined

Created on 30 Jan 2020  路  4Comments  路  Source: quasarframework/quasar

Describe the bug
I'm running Quasar 1.5.2, with node integration off. However, in my preload script I'm getting an error that require doesn't exist.

It was my understanding that I should still be able to require in the pre-load script as long as I used the same name as defined in the docs.

Turning nodeIntegration to true does fix this. But that can be a security issue, and since this is a preload script I should be able to have nodeIntegration off.

Doing some testing shows that require is available in the pre-load script, and its type is function. However, it looks like webpack is still attempting to do something with it.

Codepen/jsFiddle/Codesandbox (required)
Considering this is for Electron, a Codepen/jsFiddle/Codesandbox is not doable. However.

Main Window Creation (src-electron/main-process/electron-main.js):

import { app, BrowserWindow, ipcMain } from 'electron'
import path from 'path'

/**
 * Set `__statics` path to static files in production;
 * The reason we are setting it here is that the path needs to be evaluated at runtime
 */
if (process.env.PROD) {
  global.__statics = require('path').join(__dirname, 'statics').replace(/\\/g, '\\\\')
}

let mainWindow

function createWindow () {
  /**
   * Initial window options
   */
  mainWindow = new BrowserWindow({
    width: 1000,
    height: 600,
    useContentSize: true,
    webPreferences: {
      preload: path.resolve(__dirname, 'electron-preload.js'),
      nodeIntegration: false,
      enableRemoteModule: false,
      contextIsolation: true,
      sandbox: true
    }
  })

  mainWindow.loadURL(process.env.APP_URL)

  mainWindow.on('closed', () => {
    mainWindow = null
  })
}

app.on('ready', createWindow)

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', () => {
  if (mainWindow === null) {
    createWindow()
  }
})

ipcMain.on('check', (event, data) => {
  // Access form data here
  console.log(data)
})

Preload (src-electron/main-process/electron-preload.js):

const { ipcRenderer } = require('electron')

process.once('loaded', () => {
  window.addEventListener('message', event => {
    const message = event.data

    ipcRenderer.send(message.myTypeField, message)
  })
})

To Reproduce
Steps to reproduce the behavior:

  1. Turn off node integration
  2. Add a pre-load script as described here
  3. Try to require ipcRenderer in pre-load script
  4. Scroll down to '....'
  5. See error

Expected behavior
I would expect to be able to run requires in Electron Pre-load scripts

Screenshots

Platform (please complete the following information):
OS: Windows 10 & Mac 10.15.1
Node: 8.11.1
NPM: 6.0.1
Electron: 5.0.13

bug

All 4 comments

per the suggestion of a kind soul on the discord, I attempted to use.

import { ipcRenderer } from 'electron'

However, this sadly results in an error as well.

I think the issue comes from using a project that was originally generated with an older version of quasar.

I created a brand new project and was able to use require just fine.

If not following the exact syntax as in the starter kit (or indicated in docs) where you point to the preload script, then things might work just for prod or just for dev...

@rstoenescu

My Code (As above):

preload: path.resolve(__dirname, 'electron-preload.js'),

Docs (As detailed here):

preload: path.resolve(__dirname, 'electron-preload.js')

I'm not seeing the difference

Was this page helpful?
0 / 5 - 0 ratings