web-dev-qa-db-ja.com

不明なエラー：モジュール 'jquery'が見つかりません

Electron を使用してデスクトップアプリを作成しています。私のアプリでは、外部サイト（Atomアプリの外部）を読み込んでいます http：//mydummysite/index.html pageと言います。

Atom Editor のアプリの構造は次のとおりです。

enter image description here

つまり、次の部分があります：

  1. main.js
  2. package.json
  3. nodemodules> jquery（jqueryをロードするため）

ソースコード：

main.js：

   'use strict';

    var app = require('app');

    app.on('ready', function() {
      var BrowserWindow = require('browser-window');

      var win = 
      new BrowserWindow({ width: 800, height: 600, show: false, 
               'node-integration':true });
      win.on('closed', function() {
        win = null;
      });

      win.loadUrl('http://mydummysite/index.html ');
      win.show();
    });

package.json：

{
  "name": "my-mac-app",
  "version": "5.2.0",
  "description": "My Mac Desktop App",
  "main": "main.js",
  "scripts": {
    "start": "electron ."
  },
  "author": "Me",
  "license": "ISC",
  "dependencies": {
    "jquery": "^2.1.4"
  }
}

外部ページ- http：//mydummysite/index.html ページコード：

<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <h1>Hello World!</h1>

  </body>
<script>

   var jqr=require('jquery');

</script>
</html>

上記のアプリを（アプリケーションフォルダーをElectronにドラッグして）実行すると、外部ページ（ http：//mydummysite/index.html ）がElectron Shellに読み込まれますが、エラー "キャッチされていないエラー：モジュール 'jquery'が見つかりません"

enter image description here

この問題の原因を見つけるのを手伝ってもらえますか？

ディレクトリ構造のスクリーンショットでわかるように、jqueryモジュールをフォルダーにインストール済みであり、「npm install jquery」コマンドで実行しました。

注：JSの「require」コマンドで遊ぶために、外部ページ http：//mydummysite/index.html pageに「require（ "ipc"）」を追加してみました。 require（ "jquery"）の理由です。

Electronで外部モジュール（jquery）を正しい方法で追加しましたか？

Package.jsonに依存関係がありませんか？

私がすでに試したこと：

  • npm cache clean、npm install jquery（to my app folder）
  • npm install --jqueryを保存
  • npm install jquery -g
  • npm再構築
  • Sudo npm install jquery -g
  • Sudo npm install jquery
  • export NODE_PATH =/usr/local/lib/node_modules

これは、module.jsでエラーがスローされた場所のスクリーンショットです

enter image description here

誰かがrequire（ "ipc"）が機能していてrequire（ "jquery"）が機能しない理由を提案できますか？

私の目標は、ノード統合がtrueのElectronアプリでjQueryを使用することです。

javascriptjquerynode.jsatom-editorelectron
53
Raghav

Npmでjqueryをインストールするだけでは不十分です：

npm install --save jquery

プロジェクト内のjQueryのソースファイルを回復します。ただし、htmlファイルにスクリプトを含める必要があります。

<!DOCTYPE html>
<html>
  <head></head>

  <body>
      <h1>Hello World!</h1>
  </body>

  <!-- Try to load from cdn to exclude path issues. -->
  <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>

  <script>
     window.jQuery = window.$ = jQuery;

     $(document).ready(function() {
         console.log( "jQuery is loaded" );
     });
  </script>

</html>
7
Damien

ElectronでjQueryを使用するときに同じ問題が発生し、これらのケースの解決策を見つけます。

<script type="text/javascript" src="js/jquery.min.js"
 onload="window.$ = window.jQuery = module.exports;" ></script>

ソース： https://discuss.atom.io/t/electron-app-to-Host-external-site/16390/9

3
gunivan
# assuming you have installed jquery locally instead of globally like in as
npm install jquery -s         # without -g flag

代わりにrequire（ "jquery" ）、ソースディレクトリからの相対パスを指定します
require（ "./ node_modules/jquery/dist/jquery.min.js "）;

以下を試してください：

<script>window.$ = window.jQuery = require('./node_modules/jquery/dist/jquery.min.js');</script>

OR

<script>var $ = jQuery = require('./node_modules/jquery/dist/jquery.min.js');</script>
3
VanagaS

以下のリンクがあなたの疑問に光を当てることを願っています

require（ "ipc"）が動作しているのにrequire（ "jquery"）が動作しないのはなぜですか？

https://github.com/atom/electron/issues/254

https://discuss.atom.io/t/electron-app-to-Host-external-site/16390/7

2
Akki619

同じ問題が私に起こりました、簡単な解決策はこれをindex.jsファイルに追加することです：

app.on('ready', function() {
      var mainWindow = new BrowserWindow({
        "node-integration": false
      })
//rest of your initialization code here.
})

この問題はnodeが原因です。詳細については、これを参照してくださいpost

Node-integrationをfalseに設定すると、レンダラープロセスでnode.jsが無効になります。つまり、アプリはWebブラウザーが行うことしかできません。

0
ProllyGeek