当build打包后,app.js过大的时候,可以考虑用异步组件的方式。
import HomeHeader from "./components/Header"; import HomeSwiper from "./components/Swiper"; import HomeIcons from "./components/Icons"; import HomeRecommend from "./components/Recommend"; import HomeWeekend from "./components/Weekend"; export default { name: "Home", components: { HomeHeader, HomeSwiper, HomeIcons, HomeRecommend, HomeWeekend } }
以下是异步组件加载方式:
<script> // import HomeHeader from "./components/Header"; // import HomeSwiper from "./components/Swiper"; // import HomeIcons from "./components/Icons"; // import HomeRecommend from "./components/Recommend"; // import HomeWeekend from "./components/Weekend"; export default { name: "Home", components: { HomeHeader: () => import("./components/Header"), //异步组件加载方式 HomeSwiper: () => import("./components/Swiper"), HomeIcons: () => import("./components/Icons"), HomeRecommend: () => import("./components/Recommend"), HomeWeekend: () => import("./components/Weekend") } }