タグ付けされた質問 「requirejs」

すべてのページのJSファイルを読み込む方法について、Googleの結果の3ページを読みましたが、まだ実行できません。 いくつか疑問がありますが、誰かがそれらをクリアできることを願っています。 内部app/codeでモジュールを作成する必要がありますrequirejs-config.jsか？またはrequirejs-config.js、代わりにテーマを内部に配置できますか？ 中に何を入れrequirejs-config.jsたらいいですか？ .jsファイル内のコードはどのように見えますか？jQueryを使用することはできずdocument.ready、define([ 中に何を入れdefine([たらいいですか？ サードパーティのjQueryモジュールがある場合、それらを機能させるには編集する必要がありますか？ my.jsファイルが存在することをmagentoに伝えるために、xmlをどこかに配置する必要がありますか？ 内部app/codeにすべてのjsコードを含むモジュールを作成すると、すべてのページにすべてのものが含まれますか？どうすればそれを達成できますか？

38 magento2  javascript  requirejs 

Magento2はスクリプトの読み込みにRequireJSを使用しており、スキンフォルダーがなくなったため、問題が発生しました。 変更したバージョンでMagentoのモジュールJSファイルを置き換えるにはどうすればよいですか？ たとえば、Magento_Checkout拡張機能に属するopc-checkout-method.jsです。私が見る限り、それはrequirejs-config.jsファイルで定義されていません。 私の拡張機能はMagento_Checkoutの後にロードされるため、requirejs-config.jsデータは、結果のrequirejs-configファイルの最後に追加されます。 または、スクリプト全体を置き換えることなく、他の方法でそれを行う必要がありますか？

34 javascript  overrides  magento2  requirejs 

requirejs-config.jsMagentoテーマを介してファイルを含める（またはRequireJSを構成する）ことは可能ですか？または、Magentoモジュール専用の機能ですか？テーマ構造上のdevのドキュメントの情報は、このポイントにあいまいです。 開発者ドキュメントではRequireJSについては何も言及していませんが、テーマにはが含まれてwebいるため、javascriptをバンドルできます。JavaScriptをテーマにバンドルできる場合、それはRequireJSモジュールをテーマにバンドルできることを意味し、RequireJSモジュールをテーマにバンドルできる場合、そのモジュールは特定のRequireJS構成を必要とする可能性があります。 私の素朴な仮定はテーマになるだろう、この能力を持っているが、私はこの1つの方法または他の任意のドキュメントを見つけることができていない、とMagentoののに必要なコードの洞窟探検をして過ごすために無料のアフタヌーンいないrequirejs-config.jsファイルを含むを。

19 magento2  theme  javascript  requirejs 

KnockoutJSドキュメントを非常に大まかに読むと、非常に基本的なKnockoutビューの初期化は次のようになります。 // This is a simple *viewmodel* - JavaScript that defines the data and behavior of your UI function AppViewModel() { this.firstName = "Bert"; this.lastName = "Bertington"; } // Activates knockout.js ko.applyBindings(new AppViewModel()); つまり、オブジェクトコンストラクターとして使用するjavascript関数を作成し、そこからオブジェクトをインスタンス化し、そのオブジェクトをko.applyBindingsグローバルノックアウトオブジェクトのメソッドに渡します（ko） ただし、Magento 2では、グリッドUIでバックエンドページをロードすると、Magentoはjs/core/app.jsRequireJSモジュールを初期化します /** * Copyright © 2016 Magento. All rights reserved. * See COPYING.txt for license …

19 magento2  javascript  requirejs  knockoutjs 

Magentoの2のUIフォーム部品のコンフィギュレーションファイルでは、多くの場合、表示されますitemが同じで属性をsource- <item name="source" xsi:type="string">block</item>以下。 #File: vendor/magento/module-cms/view/adminhtml/ui_component/cms_block_form.xml <field name="title"> <argument name="data" xsi:type="array"> <item name="config" xsi:type="array"> <item name="dataType" xsi:type="string">text</item> <item name="label" xsi:type="string" translate="true">Block Title</item> <item name="formElement" xsi:type="string">input</item> <item name="source" xsi:type="string">block</item> <item name="sortOrder" xsi:type="number">20</item> <item name="dataScope" xsi:type="string">title</item> <item name="validation" xsi:type="array"> <item name="required-entry" xsi:type="boolean">true</item> </item> </item> </argument> </field> これらのフィールドは何のためのものですか？必要ではないようだからお願いします。たとえば、このGitHubリポジトリのモジュールは 、動作するUIコンポーネントフォームを構成しますが、これらのname="source"アイテムは使用しません。 誰もがこれらのname="source"アイテムの目的を知っていますか？XMLを取得し、x-magento-initJSON として構成するUIコンポーネントメカニズムを知っています。 "block_id": { …

17 magento2  uicomponent  forms  knockoutjs  requirejs 

Magento 2のRequireJS実装では、多くのコアモジュールがこのような構成を使用します map: { '*': { editTrigger: 'mage/edit-trigger', addClass: 'Magento_Translation/add-class' } } RequireJSでは、map構成ディレクティブにより、開発者はRequireJSに通知できます モジュールXをロードし、モジュールYを使用する場合、モジュールYをモジュールZに置き換えます- ただし、モジュールXのみ または、コードで map: { 'modulex':{ 'moduley':'modulez' } } このmap機能により、基本的に設定を介してモジュール定義を交換できます。Magentoで言えば、これはjavascriptのモジュール書き換え機能です。 ただし、Magento *がmapプロパティのキーとして多用しているのは明らかではありません。 map: { '*': { editTrigger: 'mage/edit-trigger', addClass: 'Magento_Translation/add-class' } } *基本的には、このマッピングを行う*言うすべてのモジュール、およびその使用目的のケースでは、ベースモジュールエイリアシング提供、より具体的なモジュールに変更することができます。 ただし、MagentoはRequireJSのpathspropertyの代わりとして使用するようです。すなわち、Magentoは次のことで同じことを達成できたようです paths: { 'editTrigger': 'mage/edit-trigger', 'addClass': 'Magento_Translation/add-class', } そして、必要なときに特定のマッピングを選択的に行います。 Magentoがmap:*パスエイリアシングの方法として選択した理由を誰もが知っていますか？すなわち-の違いの理解mapとpath不完全です-または、これらの「1つのうちの6つ、他の6つ」のものの1つです。または、この方法でMagentoが取得する追加の動作があります。 特定の問題を解決することを求めず、RequireJSとMagentoの実装についての誤解を明確にするように求めます。

17 magento2  javascript  requirejs 

こんにちは。Magento2を初めて使い、MagentoでRequireJSがどのように機能するかを理解しようとしています。 私の状況は次のとおりです。 次のモジュールがあります： app/code/Mymodule/Test/view/frontend/requirejs-config.js このファイルの内容は次のとおりです。 var config = { map: { '*': { jQuery110: "Mymodule_Test/js/jquery-1.10.2", jqueryNoConflict: 'Mymodule_Test/js/jquery.no-conflict', flexslider: 'Mymodule_Test/js/jquery.flexslider-min', header: 'Mymodule_Test/js/store/header' } } }; 私のテーマは次の場所にあります。 app/design/frontend/Mycompany/Basic 私のJavascriptは次の場所にあります。 app/code/Mymodule/Test/view/frontend/web/js/jquery.no-conflict.js app/code/Mymodule/Test/view/frontend/web/js/jquery.flexslider-min.js app/code/Mymodule/Test/view/frontend/web/js/store/header.js PHTMLファイル内： app/code/Mymodule/Test/view/frontend/templates/home.phtml 行を追加しました： require(['jqueryNoConflict', 'flexslider'],function($, flexslider){ (function($) { $(window).load(function () { $('.flexslider').flexslider(); }); })(jQuery); }); ブラウザでページをチェックすると、パスに関する404エラーが表示されます。 http://mag2.com.local/pub/static/frontend/Mycompany/Basic/en_US/flexslider.js ただし、require []行を次のように変更すると、 require(['Mymodule_Test/js/jquery.no-conflict', …

17 magento2  requirejs 

Magento 2のRequireJSベースのオブジェクトシステムには、「ミックスイン」と呼ばれる機能が含まれています。Magento 2のミックスインは、ソフトウェアエンジニアが通常ミックスイン/特性と考えるものではありません。代わりに、Magento 2ミックスインを使用すると、RequireJSモジュールが返すオブジェクト/値を、メインプログラムがそのオブジェクト/値を使用する前に変更できます。このようにMagento 2ミックスインを設定します（requirejs-config.jsファイルを使用） var config = { 'config':{ 'mixins': { //the module to modify 'Magento_Checkout/js/view/form/element/email': { //your module that will do the modification 'Pulsestorm_RequireJsRewrite/hook':true } } } }; 次に、hook.js（または構成したRequireJSモジュール）が必要です。 define([], function(){ console.log("Hello"); return function(theObjectReturnedByTheModuleWeAreHookingInto){ console.log(theObjectReturnedByTheModuleWeAreHookingInto); console.log("Called"); return theObjectReturnedByTheModuleWeAreHookingInto; }; }); 関数を返します。Magentoはこの関数を呼び出し、変更する「モジュール」への参照を渡します。この例では、RequireJSモジュールによって返されるオブジェクトになりますMagento_Checkout/js/view/form/element/email。これは関数である場合も、スケーラー値である場合もあります（RequireJSモジュールが返すものに応じて）。 このシステムはmixins、元のRequireJSモジュールから返されたオブジェクトがextendメソッドをサポートしている場合にmixinのような動作を作成できるため、呼び出されているように見えます。 define([], function(){ 'use strict'; console.log("Hello"); var …

16 magento2  requirejs  mixins 

デフォルトの構成可能なオプションラベル「Choose an Option ...」を属性名で置き換える拡張機能を作成しています。たとえば、「Choose a Color ...」です。 jQueryウィジェットconfigurable.jsを（オーバーライドではなく）拡張し、この行のみを変更するにはどうすればよいですか？ 私はドキュメントからjQueryウィジェットをオーバーライドできることを知っているので、私はそうしました： define([ 'jquery', 'jquery/ui', 'configurable' // usually widget can be found in /lib/web/mage dir ], function($){ $.widget('silvan.configurable', $.mage.configurable, { }); return $.silvan.configurable; }); このファイルを初期化するにはどうすればよいですか？requirejs-config経由でロードする必要がありますか？マップ機能は、オーバーライドするためだけのものですか？ この行のみを変更することは可能ですか？この関数から呼び出されます： _fillSelect: function (element) {}

15 magento2  requirejs 

私は拡張する必要がありますMagento_Catalog/js/price-box.js。「ミックスイン」機能を使用しましたが、では機能しませんprice-box.js。 requirejs-config.js： var config = { config: { mixins: { 'Magento_Catalog/js/price-box': { 'My_Module/js/price-box/pluggin': true } } } }; My_Module/view/frontend/web/js/price-box/pluggin.js define(function () { 'use strict'; return function (target) { // modify target var reloadPrice = target.reloadPrice; target.reloadPrice = function() { cosole.log("hello"); }; return target; }; });

15 magento2  javascript  requirejs 

特定の条件（たとえば、構成に基づいて）でのみRequireJsコンポーネントを置き換えたいと思います。プログラムでモジュールの読み込みを防ぐ方法requirejs-config.jsや、それを実現する別の方法はありますか？

14 magento2  magento2.2  overrides  requirejs  magento2.3 

「カートに追加」のテキストを「」に変更して「これが欲しい」に変更しましたvendor\magento\module-catalog\view\frontend\templates\product\list.phtml。 しかし、「これが欲しい」（つまり「カートに追加」）ボタンをクリックすると、製品がカートに追加され、再び「カートに追加」というテキストがボタンに表示されます。 製品はajax呼び出しを介して追加されると思います。そのため、ajax呼び出しの後に新しく追加されたテキストが表示されず、「カートに追加」テキストが表示されます。 私はこれを試しました： カスタム拡張Ved_Mymoduleを作成しました。 拡張機能がアクティブであることを確認しました。 その後、次の手順を実行しました。 app / code / Ved / Mymodule / view / frontend / requirejs-config.js： var config = { map: { '*': { catalogAddToCart:'Ved_Mymodule/js/customCatalogAddToCart' } } }; app / code / Ved / Mymodule / view / frontend / web / js / customCatalogAddToCart.js： define([ …

13 magento2  overrides  addtocart  requirejs 

次のようなUIコンポーネントプロパティの使用方法imports: {}とexports: {}共有方法を理解しています。 defaults: { exports: { shouldShowMessage: '${$.component}' } } エクスポートでコンポーネント名を返します。 しかし、Knockoutオブザーバブルをエクスポートしようとすると、常に未定義になります。 defaults: { exports: { shouldShowMessage: '${$.shouldShowMessage}' } } ... setupKoBindings: function() { this.shouldShowMessage = ko.observable('Testing'); } 回避策として、ここで説明するようにストレージモデルを作成しますが、インポートとエクスポートを使用したいと思います。

12 magento2  javascript  uicomponent  knockoutjs  requirejs 

私は今週末ずっと何かを完成させてオンラインで公開しようと努力してきましたが、それはどれほどうまくいかなかったのか、なぜだかわからないので、誰かが私を助けてくれることを願っています。 カスタムjQueryをカスタムテーマに追加しようとしましたが、jQueryが読み込まれ、関数が機能していたため、成功しました。しかしながら！正しく機能していませんでした。たとえば、SafariはjQueryをロードしないため、コンソールに次のエラーが表示され続けます。 defaultCaptcha.js：29 Uncaught TypeError：未定義のauthentication-popup.jsのプロパティ 'captcha'を読み取ることができません：26 Uncaught TypeError：undefined（無名関数）のプロパティ 'autocomplete'を読み取れません 私はjQueryを宣言する方法に何らかの関係があると思いましたが、そうでない場合、カスタムJSをすべて削除することに決めましたが、それでもこれらのエラーが発生しました。何かがさらに壊れているようです。 私のカスタム「テーマ」は、私がカスタムサブスクリプションボックス以外の何もない単純なランディングページです。 これらのエラーの原因は何ですか？

11 magento2  javascript  magento-2.1  requirejs 

Magento2のモジュールを開発しています。requirejsを使用して、jqueryに依存するカスタムJavaScriptをロードしています。requirejs-config.jsのshimオプションを使用して、カスタムスクリプトとjqueryの間にこの依存関係を設定しています。問題は、この依存関係が（常に）設定されていないことです。jQueryはスクリプトの前に読み込まれることもあれば、問題なく動作することもありますが、スクリプトの後で読み込まれることもあり、スクリプトエラーが発生します。 Uncaught ReferenceError: jQuery is not defined(anonymous function) @ jquery.easing.1.3.js:39 Uncaught ReferenceError: jQuery is not defined(anonymous function) @ jquery.flexslider-min.js:5 Uncaught TypeError: $(...).flexslider is not a function 以下のrequirejs-config.jsの例をご覧ください。 var config = { map: { '*': { 'flexslider': 'Vendor_Modulejs/jquery.flexslider-min', 'picturefill': 'Vendor_Modulejs/picturefill.min', 'easing': 'Vendor_Modulejs/jquery.easing.1.3', 'hoverintent': 'Vendor_Modulejs/jquery.hoverIntent', 'fitvids': 'Vendor_Modulejs/jquery.fitvids', 'vimeo': 'Vendor_Modulejs/jquery.vimeo.api.min' } }, shim: …

11 magento2  requirejs