relativamente nuevo en el área de electrones:
Probé algunos métodos para resolver este problema, como usar ./ en lugar de / o agregar "homepage" : en packaging.json y aún no funciona.
Estaba tratando de importar estos dos
<script src="node_modules/gridstack/dist/gridstack-h5.js"></script> <link href="node_modules/gridstack/dist/gridstack.min.css" rel="stylesheet"/>mi json:
{ "name": "login", "version": "1.0.0", "homepage":"./", "main": "main.js", .... }html:
<!DOCTYPE html> <head> <title>Infomation Board </title> <link rel="stylesheet" href="../styles/styles.css" /> <script src="node_modules/gridstack/dist/gridstack-h5.js"></script> <link href="node_modules/gridstack/dist/gridstack.min.css" rel="stylesheet"/> </head> <body> ... ..Y cuando ejecuto la depuración, aparece uno de estos errores:
GET file:///C:/node_modules/gridstack/dist/gridstack-h5.js net::ERR_FILE_NOT_FOUND GETfile:///C:/Users/whatd/OneDrive/Desktop/Amazon%20Verson%202/src/directories/node_modules/gridstack/dist/gridstack.min.css net::ERR_FILE_NOT_FOUNDdirectorio:
¿Cómo haría para resolver este problema?
Creo que la línea "homepage": en su archivo package.json es una cosa de React. Si no está utilizando React, puede eliminar la línea "homepage": .
La línea "main": en su archivo package.json es el punto de entrada de su aplicación Electron. Por lo tanto, si el archivo js que iniciará es "main.js" , entonces "main": "main.js" es correcto.
package.json
{ "name": "login", "version": "1.0.0", "main": "main.js", ... } Si está creando su ventana de tablero de información en su archivo main.js , lo haría así.
main.js
// Electron module(s). const electronApp = require('electron').app; const electronBrowserWindow = require('electron').BrowserWindow; // Node module(s). const nodePath = require('path'); // Declare window (no garbage collect). let infoBoardWindow; // Application is now ready to start. electronApp.on('ready', () => { // Create the info-board window. infoBoardWindow = new electronBrowserWindow({ x: 0, y: 0, width: 800, height: 600, show: false, webPreferences: { nodeIntegration: false, contextIsolation: true, worldSafeExecuteJavaScript: true, enableRemoteModule: false, preload: nodePath.join(__dirname, 'preload.js') } }); // Load the info-board window. infoBoardWindow.loadFile(nodePath.join(__dirname, './src/directories/infoboard.html')) .then(() => { infoBoardWindow.show(); }) }); Ahora, para hacer referencia a los archivos gridstack css y js en su archivo infoboard.html , use rutas relativas ( ./ , ../ ), no una ruta absoluta ( / ). IE: debe subir 2 niveles de directorio para obtener acceso al directorio node_modules .
infoboard.html
<!DOCTYPE html> <head> <title>Infomation Board </title> <link rel="stylesheet" href="../styles/styles.css" /> <link rel="stylesheet" href="../../node_modules/gridstack/dist/gridstack.min.css" /> <script src="../../node_modules/gridstack/dist/gridstack-h5.js"></script> </head> <body> ... ..