亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何使用es6的動態導入從靜態導入模塊?

如何使用es6的動態導入從靜態導入模塊?

SMILET 2021-12-02 16:30:55
我正在嘗試將動態導入添加到我的代碼中,以便在客戶端獲得更好的性能。所以我有一個 webpack 配置,其中捆綁了 js 文件。在 SFCC 上,捆綁文件位于靜態文件夾中,其中該文件的路徑如下所示:/en/v1569517927607/js/app.js)我有一個函數,當用戶單擊按鈕時,我使用 es6 的動態導入來調用模塊。問題是當我們調用那個模塊時,瀏覽器找不到它,因為路徑錯誤。/en/lazyLoad.js net::ERR_ABORTED 404 (Not Found)這是正常的,因為文件位于/en/v1569517927607/js/lazyLoad.js.有沒有辦法從正確的路徑得到它?這是我的代碼。window.onload = () => {    const lazyAlertBtn = document.querySelector("#lazyLoad");    lazyAlertBtn.addEventListener("click", () => {        import(/* webpackChunkName: "lazyLoad" */ '../modules/lazyLoad').then(module => {            module.lazyLoad();        });    });};
查看完整描述

3 回答

?
紅顏莎娜

TA貢獻1842條經驗 獲得超13個贊

我遇到了同樣的問題,并使用 Business Manager 中的 Merchant Tools > SEO > Dynamic Mapping 模塊解決了它。


在那里,您可以使用如下規則將請求重定向到靜態文件夾:


**/*.bundle.js i s,,,,,/js/{0}.bundle.js

我所有的塊文件都以<module>.bundle模式命名。


在這里您可以找到更多信息:https :

//documentation.b2c.commercecloud.salesforce.com/DOC1/topic/com.demandware.dochelp/content/b2c_commerce/topics/search_engine_optimization/b2c_dynamic_mappings.html


希望這可以幫助。


查看完整回答
反對 回復 2021-12-02
?
蕪湖不蕪

TA貢獻1796條經驗 獲得超7個贊

我相信你可能需要path.resolve()在你的導入語句或webpack.config.js文件中做一些魔法

查看完整回答
反對 回復 2021-12-02
?
LEATH

TA貢獻1936條經驗 獲得超7個贊

我們以不同的方式做到了。這需要兩個步驟


從模板文件中添加一個腳本標記,為靜態路徑創建一個全局變量。就像是

// inside .isml template

<script>

    // help webpack know about the path of js scripts -> used for lazy loading

    window.__staticPath__ = "${URLUtils.httpsStatic('/')}";

</script>

然后你需要通過__webpack_public_path__在運行時更改來指示 webpack 知道在哪里可以找到塊

// somewhere in your main .js file

// eslint-disable-next-line

__webpack_public_path__ = window.__staticPath__ + 'js/';

可選步驟:


您可能還想從__staticPath__使用替換中刪除代碼版本(至少我們必須這樣做)


__webpack_public_path__ = window.__staticPath__.replace('{YOUR_CODE_VERSION_GOES_HERE}', '') + 'js/';


查看完整回答
反對 回復 2021-12-02
  • 3 回答
  • 0 關注
  • 375 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號