code-splitting

    0熱度

    1回答

    the construct of the object 我想提取「VUE」來一大塊,「jQuery的」來一大塊,並與「VUE」有關的東西,像「vuex」,「VUE路由器」到另一塊。又該用CommonChunkPlugin呢? 這些代碼是我的配置,它conbine的VUE和與他人 new webpack.optimize.CommonsChunkPlugin( name: 'vendor',

    1熱度

    1回答

    我通常以react-native或使用webpack編程。在大項目中,捆綁時間可能相當長。在反應本機中,我必須嘗試檢查react-native unbundle是否確實使應用程序速度更快,但是這裏有一個問題: 代碼拆分是否會加速構建時間?

    2熱度

    1回答

    我正在使用react-router進行代碼拆分。像AuthenticatedRoute這樣的動態路由似乎並不適用於它。 如果用戶轉到About路線,更新,並且在日誌中,並得到回About路線(而無需刷新頁面),什麼都不會顯示,因爲About航線代碼分裂塊不被替換/沒有導入About組件。 代碼: 路線 import React from 'react'; import { Route } fro

    0熱度

    1回答

    我正在使用webpack(v3.5.6)來構建(捆綁和編譯)一個web應用程序。在我們的主入口,我們(嘗試)延遲加載另一個入口文件,使用此語法: import(/* webpackChunkName: 'charts' */ './charts').then((module) => { /* do something with module */}); 有了這些條目定義: entry: {

    1熱度

    1回答

    我正在爲我的反應應用和react-router 3.0.0版本的路由使用create-react-app樣板。 我想在需要時加載組件,即基本上是代碼分割。 我被卡住了,因爲我不知道如何做代碼拆分,因爲我有一個HOC檢查用戶角色,如果用戶沒有特定路線的角色,比我重定向用戶到一些'未經授權的路線。 我也有onEnter函數,它需要在加載任何組件之前調用,它會檢查用戶令牌是否過期,如果令牌過期,我將用戶

    1熱度

    2回答

    我的包大小約爲2MB未壓縮和400KB壓縮 這束用的WebPack 1.15創建。 0。 而膜條是這樣 這是Webpackanalyzer輸出 然後,我已經更新的WebPack到2.6.1並啓用代碼劈裂和移動所有第三方JS到供應商。 js,現在bundle.js只包含我的應用程序的代碼。 我的包的大小是這樣的 這是未壓縮的大小。 但加載時間增加到7.09s 然後我們嘗試chunking based

    1熱度

    1回答

    在我的WebPack我用的外部其中有反應,陣營大教堂,終極版等 現在,當我實現我的路由組塊捆綁外部腳本,這是重新生成每塊再次捆綁外部腳本,所以最終我的包的大小非常巨大。 如何避免我的個別塊不重新捆綁外部腳本並從外部使用它們。 編輯 使用https://chrisbateman.github.io/webpack-visualizer/我可以看到我所有的塊被捆綁共同庫 - 這是實際上應該在的WebP

    1熱度

    1回答

    我在隱式通用供應商塊之後努力遵循docs。 我希望所有的node_modules都位於供應商區塊中。 我有一個入口點(app),有幾個孩子塊。 我想: new webpack.optimize.CommonsChunkPlugin({ name: 'vendors', minChunks: module => module.context && module.context.i

    0熱度

    1回答

    我試圖在我的webpack配置中爲prod構建實現代碼拆分 - 從應用程序代碼中分離供應商文件。但是,當我嘗試建立,我得到以下錯誤: ERROR in multi bootstrap font-awesome jquery popper.js progress-bar-webpack-plugin vue vue-resource vue-router vuex 上市基本上包在我的依賴關係。

    0熱度

    1回答

    我正在構建要在React應用程序中導入的組件庫。我想公開這些組件,以便它們可以動態地導入到應用程序中。 我試了一下: LIB> index.js export const Component1 = import(/* webpackChunkName: "components/Component1" */ './components/Component1') export const Compo