সমস্ত পৃষ্ঠায় প্রয়োজনীয় ফাইলগুলি লোড করতে প্রয়োজনীয় কনফিগারেশন.জেইস ব্যবহার করুন


9

require-config.jsকাস্টম থিমটিতে কীভাবে ব্যবহার করতে হয় তা আমি জানি তবে আমি myfile.jsসমস্ত পৃষ্ঠায় কাস্টম জাভাস্ক্রিপ্ট ফাইল ( ) ব্যবহার করতে চাই । আমি কোন ডিরেক্টরিতে যুক্ত করব require-config.jsএবং কীভাবে এটি ব্যবহার করব, এটি এটি যেমনটি কাজ করবে তেমন কাজ করবে?

দয়া করে, ম্যাজেন্টো অফিসিয়াল পৃষ্ঠায় উল্লেখ করবেন না।


আপনি সরাসরি লেআউট এক্সএমএল হেড ট্যাগের ভিতরে জেএস কল করতে পারেন এবং প্রতিটি পৃষ্ঠায় আপনি জেএস পেয়েছেন।
রাকেশ জেসাদিয়ার

আপনার উত্তর করার জন্য আপনাকে ধন্যবাদ। তবে যদি আমি এটির সাথে প্রয়োজনীয় কনফিগার ব্যবহার করতে চাই এবং ফাইলগুলি লোড করতে চাই, তবে ম্যাজেন্টো 1 এর মতো নয়?
অনিতর

এটি ম্যাজেন্টো 2 তেও সমর্থন করে আপনি মডিউল-থিম ফোল্ডার লেআউট /
ডিফল্ট_হেড_ব্লক.এক্সএমএল

হ্যা আমি জানি. তবে, আমি সঠিকভাবে প্রয়োজনীয় কনফিগারেশন ব্যবহার করতে চাই।
অনিতর

উত্তর:


17

requirejs-config.jsজাভাস্ক্রিপ্ট রিসোর্স ম্যাপিং তৈরি করতে ব্যবহার করে । আমরা সব অধীনে configs প্রয়োজন পেতে পারবেন: pub/static/_requirejs

আমি যতদূর জানি, আমাদের কাস্টম স্ক্রিপ্টটি লোড করার সঠিক উপায়টি প্রয়োজন জেএসের মাধ্যমে: আমাদের স্ক্রিপ্টটি কল করতে টেমপ্লেট ব্যবহার করে । আমরা Magento\Framework\View\Element\Templateএর ব্লক ক্লাস সহ নতুন টেম্পলেট তৈরি করব ।

আমরা যদি সমস্ত পৃষ্ঠায় জেএস ফাইলগুলি লোড করতে চাই এবং একটি নতুন মডিউল তৈরি করতে না চাই, আমাদের ব্লকের উচিত - ম্যাজেন্টো থিম মডিউলটি before.body.endবা এরafter.body.start container মধ্যে default.xml

এখানে চিত্র বর্ণনা লিখুন

অ্যাপ্লিকেশন / ডিজাইন / ফ্রন্টএন্ড / বিক্রেতা / থিম / Magento_Theme / লেআউট / default.xml

<?xml version="1.0"?>

<page layout="3columns" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
      xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">

    <referenceContainer name="after.body.start">
        <block class="Magento\Framework\View\Element\Template" name="custom.js" template="Magento_Theme::custom_js.phtml"/>
    </referenceContainer>

</page>

অ্যাপ্লিকেশন / ডিজাইন / ফ্রন্টএন্ড / বিক্রেতা / থিম / requirejs-config.js

var config = {
    map: {
        '*': {
            customScript:'Magento_Theme/js/customscript'
        }
    }
};

অ্যাপ্লিকেশন / ডিজাইন / ফ্রন্টএন্ড / বিক্রেতা / থিম / Magento_Theme / ওয়েব / JS / customscript.js

define('jquery', function($) {

    //Your code here
    //alert('Here');

    }(jQuery)
);

আমাদের টেমপ্লেটটি আমাদের স্ক্রিপ্টকে কল করবে: অ্যাপ / ডিজাইন / ফ্রন্টএন্ড / বিক্রেতা / থিম / ম্যাজেন্টো_থেম / টেমপ্লেট / কাস্টম_জেএস.এফটিএমএল

<script>// <![CDATA[
    require([
        'jquery',
        'customScript'
    ], function ($, script) {
        //Your code here
        //alert('Here');
    });
    // ]]>
</script>

ম্যাজেন্টো ক্যাশে সাফ করুন এবং স্থির সামগ্রী স্থাপন করুন: php bin/magento setup:static-content:deploy


আমি আমার স্ক্রিপ্টটি কল করি \app\design\frontend\Enim\blank\Magento_CatalogWidget\templates\product\widget\content\grid.phtml, তবে আমার কাছে থিম ফোল্ডারে (অ্যাপ্লিকেশন / ডিজাইন / ফ্রন্টএন্ড / বিক্রেতা / থিম / প্রয়োজনীয় জেএস-কনফিগ.জেএস) জেজে-কনফিগারেশন.জেএস এবং স্ক্রিপ্ট রয়েছে। এটা কি ঠিক আছে? সমস্যাটি হ'ল আমি একাধিক বিভিন্ন জায়গা থেকে আমার স্ক্রিপ্ট কল করি।
অনিতর

আপনার স্ক্রিপ্টটি কেবলমাত্র যখন টেমপ্লেট templa‌​tes\product\widget\c‌​ontent\grid.phtmlবলা হয় তখন প্রভাবিত করে ।
খোয়া ট্রুংদীন

হ্যাঁ, এটি ঠিক আছে - সমস্যাটি সেই একটির সাথে: magento.stackexchange.com/questions/149019/… , আমি ভাবছি যে এই সমস্যাটি কোনওভাবে প্রয়োজনীয়জ কলগুলির সাথে সংযুক্ত রয়েছে কিনা।
অনিতর

@ খোয়া ট্রুংডিনহ এই সম্পর্কে আমি একটু বিভ্রান্ত আমি এখনও সঠিকভাবে পরীক্ষা নিরীক্ষা করি নি, তবে আমি কি এই ভেবে ঠিক আছি যে এর মধ্যে custom_js.phtmlথাকা কোডটি কোডের প্রয়োগের পরে সম্পাদিত হওয়ার পরে নিয়মিত কলব্যাক হিসাবে বিবেচিত হবে customscript.js? বা আমার customscript.jsভিতরে ফাংশনটির মধ্যে থেকে ঘোষিত কোডটি কার্যকর করতে হবে custom_js.phtml?
জোশুয়া বন্যা

1
@ খোটাট্রংডিনহ আমিও ভাবছি যে কেন ইভেটার উত্তর বলে যে আপনার after.body.startপরিবর্তন করা উচিত before.body.end?
জোশুয়া বন্যা

5

প্রয়োজনীয়গুলি-কনফিগারেশন ফাইল: অ্যাপ্লিকেশন / কোড / বিক্রেতার / মডিউল / ভিউ / ফ্রন্টএন্ড / প্রয়োজনীয়js-config.js

var config = {
    paths: {            
         'myfile': "Vendor_Modulename/js/myfile"
      },   
    shim: {
    'myfile': {
        deps: ['jquery']
    }
  }
} 

আপনার জেএস ফাইলটি এতে থাকা উচিত: অ্যাপ্লিকেশন / কোড / বিক্রেতার / মডিউল / দর্শন / সম্মুখভাগ / ওয়েব / জেএস / মাইফাইল.জেএস

এখন আপনি নীচের পদ্ধতিতে আপনার টেম্পলেট ফাইলের যে কোনও জায়গায় ব্যবহার করতে পারেন:

<srcipt>
 require(["jquery","myfile"],function($,myfile){
     $(document).ready(function(){
        //call your js here...
     })
 })
</script>

হ্যাঁ, এটা সঠিক। তবে আমি জিজ্ঞাসা করেছি যে কেউ মডিউলটির উপর নির্ভর করে থিম ফোল্ডারে কীভাবে এটি ব্যবহার করতে জানেন তা - এটি কেবলমাত্র একটি মডিউলে নয়, পৃষ্ঠা জুড়ে লোড করা উচিত।
অ্যানিটার

আপনি এটি থিম ফোল্ডারেও ব্যবহার করতে পারেন, উপরের স্ক্রিপ্টটি কল করুন এবং আপনি আপনার
জেএস

আপনার কোনও সমস্যা আছে কিনা তা দয়া করে আমাকে জানান
রাকেশ জেসাদিয়ার

এটি কাজ করে, ধন্যবাদ। তবে তবুও, আমি অন্য কিছু বিষয় নিয়ে সমস্যার মুখোমুখি হয়েছি
অ্যানিটার

হাই, দয়া করে আমাকে জানাবেন কোথায় 1 ম ধাপ ফাইল রাখবেন?
প্রিয়া

2

ব্যবহার করে একটি সহজ সংস্করণ আছে deps। প্রয়োজনীয়গুলি নিজেরাই (দোকানের সব জায়গাতেই) লোড করার সময় প্রয়োজনীয় js-config.js এর নির্ভরতাগুলি আপনার ফাইলটি লোড করবে। আপনার প্রয়োজনীয়গুলি js-config.js দেখতে কেমন হবে তার একটি উদাহরণ এখানে রয়েছে :

var config = {
    // When load 'requirejs' always load the following files also
    deps: [
        'common-js'
    ],

    // Library file path.
    paths: {
        'common-js': 'js/Your-File-Name'
    },

    // The rest of your config file ...

1

খোয়ার সুপারিশের বিকল্প পদ্ধতির হিসাবে, যা দুর্দান্ত ম্যাগেন্টো দেব অনুশীলন, আপনি নিজের জাভাস্ক্রিপ্ট একটি। Phtml ফাইলে এই জাতীয়ভাবে পেস্ট করতে পারেন:

<srcipt>
require(["jquery"],function($){
 $(document).ready(function(){
    your script here...
 })
});
</script>

তারপরে আপনার পিএইচটিএমএল ফাইলটি खोয়ার উত্তরে বর্ণিত ডিফল্ট.এক্সএমএল থেকে লিঙ্ক করুন, যদিও আমি এটি আগে.body.end এ যুক্ত করার পরামর্শ দিই। আর, তারপর আপনার জাতীয় স্ক্রিপ্ট থেকে মধ্যে কল copyright.phtml , এভাবে:

<script>
jQuery(document).ready(function($) {
..call your script here ..
});
</script>

কপিরাইট.পিএইচটিএমএল প্রতিটি পৃষ্ঠায় এমনকি চেকআউটের মতো পৃষ্ঠাগুলিতে লোড হয়ে যায়, যেখানে পাদলেখ বাদ দেওয়া হয়।

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