web-dev-qa-db-fra.com

Impossible de trouver le module 'électron'

Je travaille sur une application Node.js utilisant la version "0.34.3" d'Electron.

Le problème que je rencontre est que lorsque j'essaie d'inclure le module 'électron' dans un processus de rendu comme suit: require('electron').remote; et lorsque je npm start--, l'erreur suivante apparaît:

{ [Error: Cannot find module 'electron' from '/Users/waley/code/PROJECT/src/connect']
  stream: 
   Labeled {
     _readableState: 
      ReadableState {
        objectMode: true,
        highWaterMark: 16,
        buffer: [],
        length: 0,
        pipes: [Object],
        pipesCount: 1,
        flowing: true,
        ended: false,
        endEmitted: false,
        reading: true,
        sync: false,
        needReadable: true,
        emittedReadable: false,
        readableListening: false,
        defaultEncoding: 'utf8',
        ranOut: false,
        awaitDrain: 0,
        readingMore: false,
        decoder: null,
        encoding: null,
        resumeScheduled: false },
     readable: true,
     domain: null,
     _events: 
      { end: [Object],
        error: [Object],
        data: [Function: ondata],
        _mutate: [Object] },
     _eventsCount: 4,
     _maxListeners: undefined,
     _writableState: 
      WritableState {
        objectMode: true,
        highWaterMark: 16,
        needDrain: false,
        ending: true,
        ended: true,
        finished: true,
        decodeStrings: true,
        defaultEncoding: 'utf8',
        length: 0,
        writing: false,
        corked: 0,
        sync: false,
        bufferProcessing: false,
        onwrite: [Function],
        writecb: null,
        writelen: 0,
        bufferedRequest: null,
        lastBufferedRequest: null,
        pendingcb: 0,
        prefinished: true,
        errorEmitted: false },
     writable: true,
     allowHalfOpen: true,
     _options: { objectMode: true },
     _wrapOptions: { objectMode: true },
     _streams: [ [Object] ],
     length: 1,
     label: 'deps' } }
[11:36:40] js error Cannot find module 'electron' from '/Users/waley/code/PROJECT/src/connect     

Une idée de ce qui se passe? Merci!

14
Waley Chen

il existe plusieurs façons de résoudre les problèmes d'importation de modules electron concernant Modifications de l'API dans Electron 1.0 .

Veuillez noter que cela se produit généralement avec un bundle tel que webpack qui annule la fonction require.

Utiliser la propriété target de Webpack

Si vous utilisez une version récente de Webpack en tant qu’ensemble, ajoutez

target: 'electron-renderer'

à votre config devrait vous laisser utiliser:

import 'electron' from electron;

Déclarez electron en dehors de votre construction

<!-- electron declaration -->
<script>
    const electron = require('electron');
</script>

<!-- your app build -->
<script src="dist/bundle.js"></script>

De cette façon, je peux accéder à electron de n’importe où.

Utilisez le window.require

Electron a étendu l'objet window afin que vous puissiez utiliser:

const electron = window.require('electron');

Utilisez l'ancienne méthode (toujours supportée)

var remote = require('remote');
var app    = remote.app; // to import the app module, for example
17
martpie

Exécuter cette commande 

npm installer --save-dev electron

pour plus de détails cliquez ici

10
Deepak Chawla

J'ai eu cette erreur quand j'ai oublié d'ajouter "main": "./main.js", à package.json quelque part avant les scripts . Pour une installation complète, suivez ce superbe tutoriel

Modifier:

Voici un résumé de ce lien:

Installer Electron

npm install electron --save-dev

Mise à jour index.html

La page racine générée dans Angular pointe la base href vers/- cela causera des problèmes avec Electron ultérieurement, alors mettons-le à jour maintenant. Ajoutez juste un point devant la barre oblique dans src/index.html.

<base href="./">

Configure Electron

Créez un nouveau fichier nommé main.js à la racine de votre projet (au même niveau que package.json) - il s’agit du backend Electron NodeJS. Il s’agit du point d’entrée pour Electron et définit la réaction de notre application de bureau aux divers événements exécutés via le système d’exploitation de bureau.

const { app, BrowserWindow } = require('electron')

let win;

function createWindow () {
  // Create the browser window.
  win = new BrowserWindow({
    width: 600, 
    height: 600,
    backgroundColor: '#ffffff',
    icon: `file://${__dirname}/dist/assets/logo.png`
  })


  win.loadURL(`file://${__dirname}/dist/index.html`)

  //// uncomment below to open the DevTools.
  // win.webContents.openDevTools()

  // Event when the window is closed.
  win.on('closed', function () {
    win = null
  })
}

// Create window on electron intialization
app.on('ready', createWindow)

// Quit when all windows are closed.
app.on('window-all-closed', function () {

  // On macOS specific close process
  if (process.platform !== 'darwin') {
    app.quit()
  }
})

app.on('activate', function () {
  // macOS specific close process
  if (win === null) {
    createWindow()
  }
})

Ajoutez main.js et les scripts personnalisés à package.json. Votre package.json devrait ressembler à ceci:

{
  "name": "angular-electron",
  "version": "0.0.0",
  "license": "MIT",
  "main": "main.js", // <-- update here
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "electron": "electron .", // <-- run electron 
    "electron-build": "ng build --prod && electron ." // <-- build app, then run electron 
  },
  // ...omitted
}

Exécutez la commande pour construire et lancer electron

npm run electron-build
1
STIKO