如何使用現代語法將 jQuery 匯入到您的 ES6 應用程式？

使用ES6 語法導入jQuery

在基於ES6 的JavaScript 應用程式中，只需對程式碼庫進行一些調整即可實現導入jQuery。

ES6 匯入語句

要匯入jQuery，請在index.js 檔案中使用下列語法：

import {$, jQuery} from 'jquery';

透過直接匯入{$, jQuery}，您'確保$ 和jQuery 別名都可以在程式碼中存取。

節點模組與 Dist 資料夾

從 node_modules/ 目錄匯入，因為這是 jQuery 套件所在的位置。 Dist 資料夾通常用於生產就緒程式碼，從這裡匯入與建置流程不符。

設定全域變數

要使jQuery 可用於應用程式中的其他腳本，將其指派給window 物件：

window.$ = $;
window.jQuery = jQuery;

此步驟確保jQuery 可以全域存取，無論ES6 模組邊界如何。

範例程式碼

這裡有一個範例完整的index.js：

import {$, jQuery} from 'jquery';

// Make jQuery globally available
window.$ = $;
window.jQuery = jQuery;

console.log($('div'));

透過執行以下步驟，您可以成功將jQuery 匯入到ES6 應用程式中，同時保持與依賴全域jQuery 的現有腳本的兼容性。

以上是如何使用現代語法將 jQuery 匯入到您的 ES6 應用程式？的詳細內容。更多資訊請關注PHP中文網其他相關文章！