库使用情况
vue
vue-router
axios
muse-ui
material-icons
vue-baidu-map
未优化前
首先我们在正常情况下build
优化
1. 按需加载
当前流行的UI框架如iview,muse-ui,Element UI都支持按需加载,只需稍微改动一下代码.
修改前：
修改后：
importappBarfrom'muse-ui/src/appBar'importtoastfrom'muse-ui/src/toast'importdrawerfrom'muse-ui/src/drawer'importpopupfrom'muse-ui/src/popup'Vue.component(appBar.name, appBar);Vue.component(toast.name, toast);Vue.component(drawer.name, drawer);Vue.component(popup.name, popup);
这里有点麻烦的就是你要把整个项目用到的muse-ui组件都注册一遍,当然你也可以只在用到的页面做局部引用.
让我们来看看使用按需加载后的效果?
在当前项目引用了16个muse-ui组件的情况下 css减少了80kb,js减少了快200kb.
