বৈদ্যুতিন: jQuery সংজ্ঞায়িত করা হয় না


315

সমস্যা: ইলেক্ট্রন ব্যবহারের বিকাশের সময় আপনি যখন কোনও জেএস প্লাগিন ব্যবহার করার চেষ্টা করেন যার জন্য jQuery প্রয়োজন হয়, প্লাগইন jQuery খুঁজে পায় না, এমনকি আপনি স্ক্রিপ্ট ট্যাগ ব্যবহার করে সঠিক পথে লোড করলেও।

উদাহরণ স্বরূপ,

<body>
<p id="click-me">Click me!</p>
...
<script src="node_modules/jquery/dist/jquery.min.js"></script> //jQuery should be loaded now
<script>$("#click-me").click(() => {alert("Clicked")});</script>
</body>

এই কোডটি উপরে চালানো কার্যকর হবে না। আসলে, ডেভটুলগুলি খুলুন, কনসোল ভিউতে যান এবং <p>উপাদানটিতে ক্লিক করুন । আপনার function $ is not definedবা এটির কিছু দেখতে হবে ।


কেন শুধু ইলেক্ট্রন requireফাংশন ব্যবহার করবেন না ?

উত্তর:


759

একটি আরও ভাল এবং আরও জেনেরিক সমাধান আইএমও:

<!-- Insert this line above script imports  -->
<script>if (typeof module === 'object') {window.module = module; module = undefined;}</script>

<!-- normal script imports etc  -->
<script src="scripts/jquery.min.js"></script>    
<script src="scripts/vendor.js"></script>    

<!-- Insert this line after script imports -->
<script>if (window.module) module = window.module;</script>

উপকারিতা

  • একই কোড সহ ব্রাউজার এবং ইলেক্ট্রন উভয়ের জন্য কাজ করে
  • সমস্ত তৃতীয় পক্ষের গ্রন্থাগারগুলির জন্য সমস্যাগুলি ঠিক করে দেয় (কেবল jQuery নয়) প্রতিটি নির্দিষ্ট করে না রেখে
  • স্ক্রিপ্ট বিল্ড / প্যাক বান্ধব (অর্থাত গ্রান্ট / গুলপ সমস্ত স্ক্রিপ্টগুলি বিক্রেতা.জেজে রূপান্তর করে)
  • প্রয়োজন হয় না node-integrationমিথ্যা হতে পারে

উত্স এখানে


1
@ ফেয়েডনামোতি হ্যাঁ, তবে এই সমাধানের মূল বিষয়টি হ'ল আপনাকে ২ য় পক্ষের লাইব্রেরি তালিকাভুক্ত করতে হবে না (এটি কেবল কার্যকর!)। আপনি যখন অনেকগুলি লাইব্রেরি (বা স্ব-বান্ডেল লিপি) আমদানি করেন তখন হ্যান্ডি
ডেল হার্ডার্স

2
ধন্যবাদ! আমার ক্ষেত্রে, এই সমাধানটি d3 ভি 3 এর মতো পুরানো সংস্করণগুলির জন্যও নীচে বা তারও নীচে কাজ করে
হেডউইন্ডগুলি

2
@ ড্যালহার্ডার্স এটি window.moduleএকই মানের সাথে শুরু হয় module, সুতরাং আপনার কোডটি প্রত্যাশার মতো কার্যকরভাবে কাজ করে না। এটা করতে সঠিক ভাবে সংরক্ষণ করতে হয় moduleপরিবর্তে অন্য কোনো (অব্যবহৃত) উইন্ডো সম্পত্তিতে মত window.tempModule। আমি যা বলছি তা নিশ্চিত console.log(module)করতে, এখনই যাচাই করার জন্য আপনার শেষ বক্তব্যটির পরে চেষ্টা করুন module === undefined
লুসিও পাইভা

1
@ লুসিও নোপ আমাদের উইন্ডো.মডিউলে সংরক্ষণ করতে হবে যেখানে এটি তৃতীয় পক্ষের গ্রন্থাগারগুলি আশা করছে (ব্রাউজার পরিবেশ)। আমি মনে করি আপনি নোড.জেএস এবং ব্রাউজার পরিবেশকে বিভ্রান্ত করছেন। এই কৌশলটি উন্নয়নে সহায়তা করা যাতে আপনার কোড কোনও অতিরিক্ত কনফিগারেশন ছাড়াই ব্রাউজারে এবং নোড / ইলেক্ট্রનમાં চালাতে পারে। এটি করার আরও অনেকগুলি উপায় রয়েছে তবে এটি আইএমএইচও সহজ simple
ডেল হার্ডার্স

1
এটি সিএসপিতে সমস্যাযুক্ত — কোনও ইনলাইন স্ক্রিপ্ট নেই
ট্রেভর

121

Https://github.com/atom/electron/issues/254 তে দেখা গেছে এই কোডের কারণে সমস্যা দেখা দিয়েছে :

if ( typeof module === "object" && typeof module.exports === "object" ) {
  // set jQuery in `module`
} else {
  // set jQuery in `window`
}

JQuery কোডটি "দেখায়" এটি সাধারণ জেএস পরিবেশে চলমান এবং উপেক্ষা করে window

সমাধানটি সত্যিই সহজ , এর মাধ্যমে জিকুয়েরি <script src="...">লোড না করে আপনার এইরকম লোড করা উচিত:

<script>window.$ = window.jQuery = require('./path/to/jquery');</script>

দ্রষ্টব্য: পথটির আগে বিন্দুটি প্রয়োজনীয় , কারণ এটি নির্দেশ করে যে এটি বর্তমান ডিরেক্টরি। এছাড়াও, jQuery এর উপর নির্ভর করে যে কোনও প্লাগইন লোড করার আগে লোড করতে ভুলবেন না


1
ধন্যবাদ, তবে আমার কাছে কৌনিকযুক্ত ইওম্যান দ্বারা তৈরি একটি সিস্টেম রয়েছে। গ্রান্ট আমার সমস্ত বোরার নির্ভরতা নেয় এবং সেগুলি একটি বিক্রেতার.জেএস ফাইলগুলিতে তৈরি করে। আমি কীভাবে jquery লোড করতে পারি, আপনার লাইনের সাথে ঠিক করতে এবং jquery প্রয়োজন এমন অন্যান্য বওয়ার নির্ভরতা অব্যাহত রাখতে পারি?
bluesky777

বুঝতে পারছি না, বিক্রেতার.জেসের ভিতরে জ্যাকোয়ারি আছে? যদি তা হয় তবে আপনি এই উইন্ডোটি দিয়ে বিক্রেতার.জগুলি লোড করতে পারেন $ পদ্ধতি, আফাইক।
ব্রুনো ভ্যাজ

লিঙ্কযুক্ত ইস্যুতে পরে কিছু মন্তব্যগুলির আরও একটি ভাল সমাধান রয়েছে: 'node-integration': falseবিকল্প হিসাবে BrowserWindow
বোল্ডউইন

6
এটি অন্যান্য জিনিসগুলিকে প্রভাবিত করে না?
ব্রুনো ভ্যাজ

53

লেখার আর একটি উপায় <script>window.$ = window.jQuery = require('./path/to/jquery');</script>হ'ল:

<script src="./path/to/jquery" onload="window.$ = window.jQuery = module.exports;"></script>

আমি এটি সেরা উত্তর হিসাবে খুঁজে পেয়েছি কারণ আমি এখনও এটির সাথে সিডিএন ব্যবহার করতে পারি! এবং কিছুই ওভাররাইট করার প্রয়োজন নেই।
প্যাটটোমা

53

বৈদ্যুতিন FAQ উত্তর:

http://electron.atom.io/docs/faq/

আমি ইলেক্ট্রনে jQuery / RequireJS / উল্কা / AngularJS ব্যবহার করতে পারি না।

ইলেক্ট্রনের নোড.জেএস সংহতকরণের কারণে, ডিওএম-তে মডিউল, রফতানি, প্রয়োজনীয়তার মতো কিছু অতিরিক্ত চিহ্ন প্রবেশ করানো হয়েছে। এটি কিছু লাইব্রেরির জন্য সমস্যা তৈরি করে যেহেতু তারা একই নামের সাথে চিহ্নগুলি sertোকাতে চায়।

এটি সমাধানের জন্য, আপনি ইলেকট্রনে নোড ইন্টিগ্রেশন বন্ধ করতে পারেন:

// মূল প্রক্রিয়াতে।

let win = new BrowserWindow({  
 webPreferences: {
 nodeIntegration: false   } });

তবে আপনি যদি নোড.জেএস এবং ইলেক্ট্রন এপিআই ব্যবহার করার দক্ষতা রাখতে চান তবে অন্যান্য লাইব্রেরিগুলি অন্তর্ভুক্ত করার আগে আপনাকে পৃষ্ঠাতে চিহ্নগুলির নাম পরিবর্তন করতে হবে:

<head> 
<script> 
window.nodeRequire = require; 
delete window.require;
delete window.exports; delete window.module; 
</script> 
<script type="text/javascript" src="jquery.js"></script> 
</head>

@ ফ্রি 6 আমি যদি কোনও বাহ্যিক পৃষ্ঠা লোড করছি তবে আমি কী করতে পারি? :(
জর্জিওসিস

এটি কাজ করেছে তবে এটি করার পরে আমার ইলেকট্রন অ্যাপটি বন্ধ হবে না - অর্থাৎ, আমি ওয়েব পৃষ্ঠাটি থেকে বেরিয়ে যেতে পারিনি।
tale85215050

34

এই একই সমস্যা জুড়ে এসেছিল

npm install jquery --save

<script>window.$ = window.jQuery = require('jquery');</script>

আমার জন্য কাজ


এটিই আমার মূল উত্তরটি বলে।
ব্রুনো ওয়াজ

মেটেরালাইজ.মিন.জেএসস সিডিএনজেএস.ক্লাউডফ্লেয়ার . com/ajax/libs/matoryize/09.98.2/js/… দিয়ে কীভাবে এটি করা যায় হাই .. এই <script> উইন্ডো এর মত কিছু। মেটেরিয়ালাইজ = উইন্ডো.মাটিরিয়ালাইজ = প্রয়োজন ('ম্যাটারিয়ালাইজ'); কেউ সাহায্য করতে পারেন
মকজব lh

@ ব্রুনোভাজ এই উত্তরটি পরিষ্কার: :)
moeiscool

20

আপনি node-integration: falseব্রাউজার উইন্ডোতে বিকল্পগুলি ভিতরে রাখতে পারেন।

উদাহরণ: window = new BrowserWindow({'node-integration': false});


4
নোড সংহতকরণের প্রয়োজন নেই এমন ব্যবহারকারীদের জন্য এটি ভাল সমাধান।
অ্যাডাম জাজমিড

এটি দুর্দান্ত, পুরোপুরি আমার পক্ষে কাজ করে। ধন্যবাদ @ মুরিলো ফেয়ারস। কোন পদ্ধতিতে নোড-সংহতকরণ বিকল্পগুলি কী করে?
আহেসনালি সুথার

3
@ 1.4 কাজ করে না, দয়া করে ব্যবহার করুন: আসুন জিতে নিন = নতুন ব্রাউজার উইন্ডো ({ওয়েবপ্রিফারেন্স: ode নোডইন্টিগ্রেশন: মিথ্যা}})
হলি

14

একটি সুন্দর এবং পরিষ্কার সমাধান

  1. এনপিএম ব্যবহার করে jQuery ইনস্টল করুন। (npm install jquery --save )
  2. এটা ব্যবহার করো: <script> let $ = require("jquery") </script>

8

আমি একই সমস্যার মুখোমুখি এবং এটি আমার পক্ষে কাজ করেছে!

এনপিএম ব্যবহার করে jQuery ইনস্টল করুন

$ npm install jquery

তারপরে নিম্নলিখিত কোনও একটিতে jQuery অন্তর্ভুক্ত করুন।

স্ক্রিপ্ট ট্যাগ ব্যবহার করে

<script>window.$ = window.jQuery = require('jquery');</script>

ব্যাবেল ব্যবহার করা হচ্ছে

import $ from 'jquery';

ওয়েবপ্যাক ব্যবহার করা

const $ = require('jquery');


5

আমি মনে করি আমি আপনার লড়াই বুঝতে পেরেছি এবং এটি কিছুটা আলাদাভাবে সমাধান করেছি I আমার js ফাইলের জন্য স্ক্রিপ্ট লোডার ব্যবহার করেছি যা jquery.Script স্ক্রীন লোডারটি আপনার জেএস ফাইলটি নিয়ে যায় এবং এটি আপনার ভেন্ডার.জেএস ফাইলের শীর্ষে সংযুক্ত করে এটি আমার জন্য যাদু করে।

https://www.npmjs.com/package/script-loader

স্ক্রিপ্ট লোডার ইনস্টল করার পরে এটি আপনার বুট বা অ্যাপ্লিকেশন ফাইলের সাথে যুক্ত করুন।

আমদানি করুন 'স্ক্রিপ্ট! পাথ / আপনার-ফাইল.js';


4

ঠিক আছে, এখানে অন্য একটি বিকল্প রয়েছে, আপনি যদি কোনও আত্মীয় চান তবে এটি অন্তর্ভুক্ত করুন ...

<script> window.$ = window.jQuery = require('./assets/scripts/jquery-3.2.1.min.js') </script>

3

আপনি যদি Angular2 ব্যবহার করে থাকেন তবে আপনি এই কোড সহ একটি নতুন জেএস ফাইল তৈরি করতে পারেন:

// jquery-electron.js

if ((!window.jQuery || !window.$) && (!!module && !!module.exports)) {
      window.jQuery = window.$ = module.exports;
}

এবং এটি জঙ্গি পথের পরে ডানদিকে রাখুন, .angular-cli.json এ:

"scripts": [
    "../node_modules/jquery/dist/jquery.js",
    "assets/js/jquery-electron.js",
    ...
    ...
]

3

আমি বিল্ডিং এবং ইলেক্ট্রন সহ কৌণিক অ্যাপ্লিকেশন, আমার সমাধান নিম্নলিখিত ছিল:

index.html

<script>
    if ( typeof module === "object" && typeof module.exports === "object" ) {
      window.$ = window.jQuery = require('jquery');
    }
</script>

angular.json

"scripts": [
              "node_modules/jquery/dist/jquery.min.js",
              "node_modules/popper.js/dist/umd/popper.min.js",
              "node_modules/bootstrap/dist/js/bootstrap.min.js"
            ]

সুতরাং ব্রাউজারে থাকলে জিকিউরিটি কৌণিক.জসন থেকে লোড হয়ে যায়, অন্যথায় যদি এটি একটি ইলেক্ট্রন বিল্টড অ্যাপ হয় তবে তার পরিবর্তে মডিউলটির প্রয়োজন হবে।

আপনি যদি কৌণিক.জসন থেকে আমদানির পরিবর্তে সূচক html এ jquery আমদানি করতে চান তবে নিম্নলিখিত সমাধানটি ব্যবহার করুন:

<script src="path/to/jquery"></script>
<script>
    if ( typeof module === "object" && typeof module.exports === "object" ) {
      window.$ = window.jQuery = require('jquery');
    }
</script>


2

1. এনপিএম ব্যবহার করে jQuery ইনস্টল করুন।

npm install jquery --save

2।

<!--firstly try to load jquery as browser-->
<script src="./jquery-3.3.1.min.js"></script>
<!--if first not work. load using require()-->
<script>
  if (typeof jQuery == "undefined"){window.$ = window.jQuery = require('jquery');}
</script>

2

এটি আমার পক্ষে কাজ করে।

<script languange="JavaScript">
     if (typeof module === 'object') {window.module = module; module = undefined;}
</script>

বিবেচনা করার বিষয়গুলি:

1) এটি ঠিক আগে বিভাগে রাখুন </head>

2) অন্তর্ভুক্ত করুন সামনে Jquery.min.js বা Jquery.js অধিকার </body>ট্যাগ


0

আপনি নিম্নলিখিত কোড চেষ্টা করতে পারেন:

mainWindow = new BrowserWindow({
        webPreferences: {
            nodeIntegration:false,
        }
});

0

এই ইস্যুটির জন্য, আপনি ওয়েব পৃষ্ঠায় যেভাবে জিকুয়ারি এবং অন্যান্য জেএস ব্যবহার করছেন তা ব্যবহার করুন। তবে, ইলেক্ট্রনের নোড ইন্টিগ্রেশন রয়েছে সুতরাং এটি আপনার জেএস বিষয়গুলি খুঁজে পাবে না। module = undefinedআপনার জেএস অবজেক্টগুলি সঠিকভাবে লোড না হওয়া পর্যন্ত আপনাকে সেট করতে হবে। নীচে উদাহরণ দেখুন

<!-- Insert this line above local script tags  -->
<script>if (typeof module === 'object') {window.module = module; module = 
undefined;}</script>

<!-- normal script imports etc  -->
<script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous"></script>    

<!-- Insert this line after script tags -->
<script>if (window.module) module = window.module;</script>

প্রদত্ত মতো আমদানি করার পরে, আপনি JQueryইলেকট্রনে এবং অন্যান্য জিনিস ব্যবহার করতে সক্ষম হবেন ।


0

শুধু নিম্নলিখিত কমান্ড সহ Jquery ইনস্টল করুন।

npm install --save jquery

এর পরে দয়া করে জেএস ফাইলিতে বেইল লাইন রাখুন যা আপনি জ্যাকুয়ারি ব্যবহার করতে চান

let $ = require('jquery')
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.