ビッグコマースのステンシルバンドルで、JavaScriptをマイナー化しない

Question

開発中に複製できないJavaScriptエラーが発生しています。これは問題のモジュールです。

import $ from 'jquery'; 
import 'foundation-sites/js/foundation.core'; 
import 'foundation-sites/js/foundation.util.mediaQuery'; 
import 'foundation-sites/js/foundation.util.keyboard'; 
import 'foundation-sites/js/foundation.util.box'; 
import 'foundation-sites/js/foundation.util.motion'; 
import 'foundation-sites/js/foundation.util.triggers'; 
import 'foundation-sites/js/foundation.dropdown'; 

export default function() { 
    $(window).on('changed.zf.mediaquery', function(event, newSize, oldSize){ 
    toggle(); 
    }); 

    // toggle on page load 
    toggle(); 
} 

function toggle() { 
    const $drop = $('[data-more-categories-dropdown]'); 

    if (Foundation.MediaQuery.atLeast('medium')) { 
    if ($drop.data('dropdown')) { 
     $drop.foundation('destroy'); 
     $drop.removeData('dropdown'); 
     $drop.attr('style', ''); 
    } 
    } 
    else { 
    if (!$drop.data('dropdown')) { 
     new Foundation.Dropdown($drop, { 
     closeOnClick: true 
     }); 
    } 
    } 
} 

モジュールの目的は、画面ブレークポイントが変更されたときに基本ドロップダウンメニューを破棄することです。新しいブレークポイントが中またはそれ以上で、ドロップダウンが存在する場合は、それを破棄します。ブレークポイントがmediumより小さく、ドロップダウンが存在しない場合は作成します。

これは、ローカル開発版のストアでも同じように機能します。次に、「ステンシルバンドル」を実行し、ライブストアにテーマをアップロードします。私がそれをすると、ブラウザを中程度以上のブレークポイントにリサイズするたびにエラーが発生します。エラーは次のとおりです。

bundle.js:4 Uncaught ReferenceError: We're sorry, 'destroy' is not an available method for this element. 

これはjavascriptのすべてがbundle.jsファイルに縮小され、そして、私が開発に問題を再現することはできませんので、トラブルシューティングすることは非常に困難です。

stencil bundleに開発中のようにジャバスクリプトを扱うよう指示する方法はありますか（ハッキリでも）。そのようにすれば、コードにdebugger文を残して、ソースマップを使用して、その動作が本番環境で異なる理由を理解する手助けをすることができます。

これを引き起こす可能性のある他のアイデアがあれば、教えてください。

Answer 1

私は理由は分かりませんが、私はモジュールに少し変更を加えましたが、問題を修正したようです。私は現在、zfPluginデータ属性を使用して、ドロップダウンが開始されているかどうかを確認しています。新しいtoggle関数があります。

function toggle() { 
    const $drop = $('[data-more-categories-dropdown]'); 

    if (Foundation.MediaQuery.atLeast('medium')) { 
    if ($drop.data('zfPlugin')) { 
     $drop.foundation('destroy'); 
     $drop.attr('style', ''); 
    } 
    } 
    else { 
    if (!$drop.data('zfPlugin')) { 
     new Foundation.Dropdown($drop, { 
     closeOnClick: true 
     }); 
    } 
    } 
}