优化codeSplitting代码

Author: sanyuan0704

scripts/start.js

@@ -41,7 +41,7 @@ if (!checkRequiredFiles([paths.appHtml, paths.appIndexJs])) {
 }
 
 // Tools like Cloud9 rely on this.
-const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 3000;
+const DEFAULT_PORT = parseInt(process.env.PORT, 10) || 3002;
 const HOST = process.env.HOST || '0.0.0.0';
 
 if (process.env.HOST) {

src/api/lyric-parser.js

@@ -72,6 +72,7 @@ export default class Lyric {
     this.lines.sort((a, b) => {
       return a.time - b.time
     })
+
   }
 
   _findcurLineIndex(time) {

src/application/Player/index.js

@@ -85,8 +85,6 @@ function Player(props) {
     setDuration((current.dt / 1000) | 0);
     // eslint-disable-next-line
   }, [currentIndex, playList]);
- 
- 
 
   useEffect(() => {
     playing ? audioRef.current.play() : audioRef.current.pause();

src/application/Search/index.js

@@ -39,7 +39,7 @@ const Search = (props) => {
 
   useEffect(() => {
     setShow(true);
-    if(!hotList.length)
+    if(!hotList.size)
       getHotKeyWordsDispatch();
       // eslint-disable-next-line
   }, []);
@@ -200,9 +200,9 @@ const Search = (props) => {
         <ShortcutWrapper show={query}>
           <Scroll onScorll={forceCheck}>
             <div>
-              {renderSingers()}
-              {renderAlbum()}
-              {renderSongs()}
+              { renderSingers() }
+              { renderAlbum() }
+              { renderSongs() }
             </div>
           </Scroll>
         </ShortcutWrapper>

src/components/slider/index.js

@@ -11,10 +11,13 @@ function Slider(props) {
     if(bannerList.length && !sliderSwiper){
         let sliderSwiper = new Swiper(".slider-container", {
           loop: true,
-          autoplay: true,
-          autoplayDisableOnInteraction: false,
+          autoplay: {
+            delay: 3000,
+            disableOnInteraction: false,
+          },
           pagination: {el:'.swiper-pagination'},
         });
+        console.log();
         setSliderSwiper(sliderSwiper);
     }
   }, [bannerList.length, sliderSwiper])

src/routes/index.js

@@ -3,94 +3,25 @@ import { Redirect } from "react-router-dom";
 import HomeLayout from "../layouts/HomeLayout";
 import BlankLayout from "../layouts/BlankLayout";
 
-const LoginComponent = lazy(() => import("../application/User/Login"));
-const Login = props => {
+const SuspenseComponent = Component => props => {
   return (
     <Suspense fallback={null}>
-      <LoginComponent {...props}></LoginComponent>
+      <Component {...props}></Component>
     </Suspense>
-  );
-};
-
-// const HomeComponent = lazy(() => import("../application/Home/"));
-// const Home = props => {
-//   return (
-//     <Suspense fallback={null}>
-//       <HomeComponent {...props}></HomeComponent>
-//     </Suspense>
-//   );
-// };
+  )
+}
 
 const RecommendComponent = lazy(() => import("../application/Recommend/"));
-const Recommend = props => {
-  return (
-    <Suspense fallback={null}>
-      <RecommendComponent {...props}></RecommendComponent>
-    </Suspense>
-  );
-};
-
 const SingersComponent = lazy(() => import("../application/Singers/"));
-const Singers = props => {
-  return (
-    <Suspense fallback={null}>
-      <SingersComponent {...props}></SingersComponent>
-    </Suspense>
-  );
-};
-
 const RankComponent = lazy(() => import("../application/Rank/"));
-const Rank = props => {
-  return (
-    <Suspense fallback={null}>
-      <RankComponent {...props}></RankComponent>
-    </Suspense>
-  );
-};
-
 const AlbumComponent = lazy(() => import("../application/Album/"));
-const Album = props => {
-  return (
-    <Suspense fallback={null}>
-      <AlbumComponent {...props}></AlbumComponent>
-    </Suspense>
-  );
-};
-
 const SingerComponent = lazy(() => import("./../application/Singer/"));
-const Singer = props => {
-  return (
-    <Suspense fallback={null}>
-      <SingerComponent {...props}></SingerComponent>
-    </Suspense>
-  );
-};
-
 const SearchComponent = lazy(() => import("./../application/Search/"));
-const Search = props => {
-  return (
-    <Suspense fallback={null}>
-      <SearchComponent {...props}></SearchComponent>
-    </Suspense>
-  );
-};
 
 export default [
   {
     component: BlankLayout,
     routes: [
-      {
-        path: "/user",
-        component: BlankLayout, //userLayout
-        routes: [
-          {
-            path: "/user/login",
-            exact: true,
-            key: "login",
-            component: Login
-          }
-        ]
-      },
       {
         path: "/",
         component: HomeLayout,
@@ -102,47 +33,47 @@ export default [
           },
           {
             path: "/recommend",
-            component: Recommend,
+            component: SuspenseComponent(RecommendComponent),
             routes: [
               {
                 path: "/recommend/:id",
-                component: Album
+                component: SuspenseComponent(AlbumComponent)
               }
             ]
           },
           {
             path: "/singers",
-            component: Singers,
+            component: SuspenseComponent(SingersComponent),
             key: "singers",
             routes: [
               {
                 path: "/singers/:id",
-                component: Singer
+                component: SuspenseComponent(SingerComponent)
               }
             ]
           },
           {
             path: "/rank/",
-            component: Rank,
+            component: SuspenseComponent(RankComponent),
             key: "rank",
             routes: [
               {
                 path: "/rank/:id",
-                component: Album
+                component: SuspenseComponent(AlbumComponent)
               }
             ]
           },
           {
             path: "/album/:id",
             exact: true,
             key: "album",
-            component: Album
+            component: SuspenseComponent(AlbumComponent)
           },
           {
             path: "/search",
             exact: true,
             key: "search",
-            component: Search
+            component: SuspenseComponent(SearchComponent)
           }
         ]
       }