Cannot find module '@electron/remote' using interceptFileProtocol

Open
#98 5 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
3/5
Estimated time
1-2 days
Newbie friendliness
35/100
Issue type
Bug
Clarity
Mostly clear
Activity status
Stale
Tech stack
javascript
Domain
desktop

Research direction

Start with main.js and compare the packaged behavior of protocol.interceptFileProtocol('file', ...) plus loadURL with the working loadFile path. Inspect index.htm's renderer-side require('@electron/remote') and package.json's electron-builder files and asar settings, then reproduce from the packaged dist output. Done means the renderer resolves @electron/remote after the packaged application is moved and launched.

Written by the indexing model from the issue text.

Description

Hello,
i have a strange behavior using @electron/remote with interceptFileProtocol:

main.js

const { app, ipcMain, BrowserWindow, protocol} = require('electron');
const log = require('electron-log');
var win = null; 

//used for initialize object @electron/remote
require('@electron/remote/main').initialize();

//create main window
function createWindow (app) 
{
	//intercept file protocol and change some file content before display  (example)
	protocol.interceptFileProtocol('file', (request, callback) => {
		var file =   __dirname + "\\index.htm";

		log.info('Request.url -> ' + request.url);
		log.info('abs path -> ' + file);
		  
		callback({path: file});      
	});  
  
	const opts = {
		width: 1000,
		height: 650,
		transparent: false,
		useContentSize: true,
		webPreferences: {
		  nodeIntegration: true,
		  contextIsolation: false,
		  enableRemoteModule: true,
		  plugins: true
		}
	};

	var win = new BrowserWindow(opts);
 	require('@electron/remote/main').enable(win.webContents);

	win.loadURL("file:///notexist.htm");
	//win.loadFile("index.htm");
}

//open window
app.on('ready', function(){ createWindow(app) } );

//close all window/process of app
app.on('window-all-closed', () => {
  app.exit();
})

index.htm (render side)

<html>

	<script>
		const remote = require('@electron/remote');
		const { app } = remote;

		var rootPath = `${app.getAppPath()}`;
		
		window.document.onload = function(e){ 
			document.getElementById("PageContainer").innerHTML = rootPath;
		}
		
		window.addEventListener("load", function () {
			document.getElementById("PageContainer").innerHTML = rootPath;
		});
	</script>
<body>


Current application path: 
<div id="PageContainer" style="top:0px;"></div>
</body>
</html>

package.json

{
  "name": "test",
  "version": "1.0.0",
  "description": "Test",
  "main": "src/main.js",
  "author": "Example",
  "license": "ISC",
  "scripts": {
    "start": "electron .",
    "pack": "electron-builder --dir",
    "dist": "electron-builder"
  },
  "postinstall": "electron-builder install-app-deps",
  "devDependencies": {
    "electron": "^14.2.1",
    "electron-builder": "^22.10.5"
  },
  "build": {
    "productName": "Test app for load dependencies @electron/remote",
    "appId": "com.test.electronapp",
    "asar": true,
    "asarUnpack": "src/**/*",
    "win": {
      "target": [
        "portable"
      ]
    },
    "files": [
      "src/**/*"
    ],
    "portable": {
      "artifactName": "test.exe"
    }
  },
  "dependencies": {
    "@electron/remote": "^2.0.1",
    "electron-log": "^4.4.1",
    "request": "^2.88.0",
    "yarn": "^1.22.17"
  }
}

If i run the application locally "npm start" all work fine. If i run a packaging script "npm run pack" and move the content of the folder "dist" to another location (the dist folder should be self-consistent) i have the following error from @electron/remote module on render side (open debug tool with ctrl+shift+i):

Uncaught Error: Cannot find module '@electron/remote'
Require stack:

  • notexist.htm
    at Module._resolveFilename (internal/modules/cjs/loader.js:892)
    at Function.o._resolveFilename (electron/js2c/renderer_init.js:29)
    at Module._load (internal/modules/cjs/loader.js:737)
    at Function.f._load (electron/js2c/asar_bundle.js:5)
    at Function.o._load (electron/js2c/renderer_init.js:29)
    at Module.require (internal/modules/cjs/loader.js:964)
    at require (internal/modules/cjs/helpers.js:88)
    at notexist.htm:5

The strange thing is that if i use BrowserWindow.loadFile instead of BrowserWindow.loadURL all work file also on dist folder.

What am I doing wrong on this steps ?

Thanks for support.

Dominant language
TypeScript
Stars
411
Forks
53
Avg merge
3m
Merged PRs (30d)
1

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from electron/remote

All issues in electron/remote

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.