按需import提案幾年前就已提出，如今終于能進(jìn)入ES正式規(guī)范。這里個(gè)人理解成“按需”更為貼切。現(xiàn)代前端打包資源越來越大，打包成幾M的JS資源已成常態(tài)，而往往前端應(yīng)用初始化時(shí)根本不需要全量加載邏輯資源，為了首屏渲染速度更快，很多時(shí)候都是按需加載，比如懶加載圖片等。而這些按需執(zhí)行邏輯資源都體現(xiàn)在某一個(gè)事件回調(diào)中去加載。

// 點(diǎn)擊按鈕才去加載ajax模塊 const oBtn = document.querySelector('#btn') oBtn.addEventListener('click', () => {import('./ajax').then(mod => {mod.get('static/a.json', res => {console.log(res)})}) })

當(dāng)然，webpack目前已很好的支持了該特性。

Vue 中組件按需加載：

const routes = [{path: '/',name: 'User',component: User}, {path: '/upload',name: 'Upload',component: () => import('../views/Upload.vue')} ]

總結(jié)

以上是生活随笔為你收集整理的【ES11(2020)】Dynamic Import 动态引入的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。