Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Cannot find module '@electron/remote' using interceptFileProtocol #98

Open
sturla78 opened this issue Nov 23, 2021 · 5 comments
Open

Cannot find module '@electron/remote' using interceptFileProtocol #98

sturla78 opened this issue Nov 23, 2021 · 5 comments

Comments

@sturla78
Copy link

sturla78 commented Nov 23, 2021 •
edited
Loading

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.
@jane-rose
Copy link

same here

@aolyang
Copy link

aolyang commented Jan 20, 2022 •
edited
Loading

may be the same issue #66

require("@electron/remote/main"), may not match the correct package @electron/remote (@electron/remote/main is requireing a path "@electron/remote/main/index.js"), and cause bundle tools not bundle it.

And main is not export from package "@electron/remote", you can try the way from issue #66 (comment) mentioned.

@akbayt
Copy link

akbayt commented Jun 2, 2022 •
edited
Loading

same here. Sadly the suggestion didn't work with electron-forge.

@bksubhuti
Copy link

I used
npm install and then it worked.

@Uwanggood
Copy link

Uwanggood commented Oct 18, 2022 •
edited
Loading

in package.json move @electron/remote to dependencies, not devDependencies
then it works

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
6 participants
@sturla78 @akbayt @bksubhuti @jane-rose @Uwanggood @aolyang