vue單頁面應用專案優化總結

2021-08-25 08:30:11 字數 690 閱讀 8338

這是之前在公司oa專案優化時羅列的優化點,基本都已經完成,當時花了點心思整理的,儲存在這裡,方便以後其他專案用到查漏補缺。

16、引用路徑優化 webpack.base.conf.js resolve.alias

17、webpack 解析模組時應該搜尋的目錄優化 webpack.base.conf.js resolve.modules

18、使用webpack進行**分離,每個頁面打包成乙個單獨js,減少檔案體積,加快載入速度 

19、把常用的依賴使用外部cdn引入,不再打包,分擔伺服器壓力,加快頁面載入速度。

20、使用webpack**分析工具,方便針對性優化依賴和**塊。

21、同乙個元件比如多個編輯頁面切換時,本來的方案是使用watch.$route進行處理,經參考也可以在路由上加唯一key,保證切換路由重新渲染。參考中的router-view

22、合理使用vuex,頻繁切換的頁面元件比如多個編輯頁面,儲存多個資料store,減少http請求。

23、加快webpack效能,參考位址中設定 test & include & exclude

24、生產環境採用webpack-parallel-uglify-plugin替換uglifyjsplugin,提高webpack效能,參考位址中的增強****壓縮工具

25、src/api/config.js和package.json檔案,實現自動分環境執行

大型vue單頁面專案優化總結

這是之前在公司oa專案優化時羅列的優化點,基本都已經完成,當時花了點心思整理的,儲存在這裡,方便以後其他專案用到查漏補缺。16 引用路徑優化 webpack.base.conf.js resolve.alias 17 webpack 解析模組時應該搜尋的目錄優化 webpack.base.conf....

vue單頁面應用打包問題

vue單頁面應用打包各資源檔案的路徑應注意的地方 頁面所用的資源 非css引入的 修改如下 在config配置檔案下修改index.js index.js是打包配置首頁路徑檔案,dev配置生產環境 npm run dev 中的各資源路徑問題,build配置發布 npm run build 後的各資源...

vue單頁應用頁面快取方案

首先我想到的是方案a 方案一 vue的keep alive元件 具體使用如下 這樣所有的頁面都會進行快取。包裹動態元件時,會快取不活動的元件例項,而不是銷毀它們。和 相似,是乙個抽象元件 它自身不會渲染乙個 dom 元素,也不會出現在父元件鏈中。當元件在 內被切換,它的 activated 和 de...