web-dev-qa-db-ja.com

モジュール「電子」が見つかりません

Electronの「0.34.3」バージョンを使用しているNode.jsアプリで作業しています。

私が抱えている問題は、次のようにレンダラープロセスに「電子」モジュールを含めようとするとrequire('electron').remote;とnpm start--次のエラーが表示されます。

{ [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

何が起こっているのでしょうか？ありがとう！

node.jsnpmatom-editorelectron
13
Waley Chen

electronモジュールのインポートを解決する方法はいくつかあります Electron 1.0で登場するAPIの変更 。

これは通常、require関数をオーバーライドするwebpackのようなバンドラーで発生することに注意してください。

Webpackのtargetプロパティを利用する

Webpackの最新バージョンをバンドラーとして使用している場合、追加

target: 'electron-renderer'

あなたの設定にあなたが使用できるようにする必要があります：

import 'electron' from electron;

ビルド外でelectronを宣言します

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

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

これにより、どこからでもelectronにアクセスできます。

使用 window.require

Electronはwindowオブジェクトを拡張して、以下を使用できるようにしました。

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

古い方法を使用します（まだサポートされています）

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

次のコマンドを実行します：

npm install --save-dev electron

詳細については ここをクリック

11
Deepak Chawla

スクリプトの前に"main": "./main.js",をpackage.jsonに追加するのを忘れたときにこのエラーが発生しました。完全なセットアップについては、この素晴らしい チュートリアル に従ってください。

編集：

そのリンクの概要は次のとおりです。

Electronをインストール

npm install electron --save-dev

index.htmlを更新

Angularで生成されたルートページはベースhrefを/に向けます。これは後でElectronで問題を引き起こすため、今すぐ更新しましょう。src/ indexのスラッシュの前にピリオドを追加してください。 .html。

<base href="./">

電子の構成

プロジェクトのルートに（main.jsと同じレベルで）package.jsonという名前の新しいファイルを作成します-これはElectron NodeJSバックエンドです。これはElectronのエントリポイントであり、デスクトップオペレーティングシステムを介して実行されるさまざまなイベントにデスクトップアプリがどのように反応するかを定義します。

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()
  }
})

main.jsおよびカスタムスクリプトをpackage.jsonに追加します。 package.jsonは次のようになります。

{
  "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
}

コマンドを実行して、electronをビルドおよび起動します

npm run electron-build
0
STIKO