From e54eceeecb6aaa89ab524330cc27664d15933e90 Mon Sep 17 00:00:00 2001
From: "sunny.w" <iwisunny@gmail.com>
Date: Thu, 6 Sep 2018 16:45:08 +0800
Subject: [PATCH] refactor: Lighthouse audits (#331)

Fix render-page middleware
Move assets to public folder
Add robots.txt
---
 .eslintignore                                 |   3 ++-
 {src/assets => public}/1-1.svg                |   0
 {src/assets => public}/1-2.svg                |   0
 {src/assets => public}/1-3.svg                |   0
 {src/assets => public}/banner.png             | Bin
 {src/assets => public}/css/normalize.min.css  |   0
 {src/assets => public}/favicon.ico            | Bin
 .../fonts/roboto/Roboto-Bold.ttf              | Bin
 .../fonts/roboto/Roboto-Bold.woff             | Bin
 .../fonts/roboto/Roboto-Bold.woff2            | Bin
 .../fonts/roboto/Roboto-BoldItalic.ttf        | Bin
 .../fonts/roboto/Roboto-BoldItalic.woff       | Bin
 .../fonts/roboto/Roboto-BoldItalic.woff2      | Bin
 .../fonts/roboto/Roboto-Italic.ttf            | Bin
 .../fonts/roboto/Roboto-Italic.woff           | Bin
 .../fonts/roboto/Roboto-Italic.woff2          | Bin
 .../fonts/roboto/Roboto-Medium.ttf            | Bin
 .../fonts/roboto/Roboto-Medium.woff           | Bin
 .../fonts/roboto/Roboto-Medium.woff2          | Bin
 .../fonts/roboto/Roboto-MediumItalic.ttf      | Bin
 .../fonts/roboto/Roboto-MediumItalic.woff     | Bin
 .../fonts/roboto/Roboto-MediumItalic.woff2    | Bin
 .../fonts/roboto/Roboto-Regular.ttf           | Bin
 .../fonts/roboto/Roboto-Regular.woff          | Bin
 .../fonts/roboto/Roboto-Regular.woff2         | Bin
 .../assets => public}/fonts/roboto/roboto.css |   0
 {src/assets => public}/logo_dark.svg          |   0
 {src/assets => public}/logo_grey.svg          |   0
 {src/assets => public}/logo_light.svg         |   0
 {src/assets => public}/none.svg               |   0
 public/robots.txt                             |   2 ++
 server/config.yml                             |   4 ++--
 server/local_config.yml.example               |   3 ++-
 server/render-page.js                         |  20 +++++++++++-------
 src/components/Banner/index.jsx               |   6 +++---
 src/components/Base/Icon/index.jsx            |   4 ++--
 src/components/Base/Icon/index.scss           |   8 -------
 src/components/Base/Image/index.jsx           |   2 +-
 src/components/Card/index.jsx                 |   2 +-
 src/components/Footer/index.jsx               |   6 +++---
 src/components/Header/index.jsx               |   2 +-
 src/components/Nav/index.jsx                  |   2 +-
 src/components/Nav/index.scss                 |  17 +++++++++------
 src/components/Rectangle/AppImages/index.jsx  |   2 +-
 src/components/TdName/index.jsx               |   2 +-
 src/pages/AppDetail/Meta/index.jsx            |   2 +-
 src/pages/Login/index.jsx                     |   2 +-
 src/{assets => utils}/icons.js                |   0
 test/pages/__snapshots__/Home.test.js.snap    |   7 +++---
 webpack.prod.js                               |   9 ++++----
 50 files changed, 54 insertions(+), 51 deletions(-)
 rename {src/assets => public}/1-1.svg (100%)
 rename {src/assets => public}/1-2.svg (100%)
 rename {src/assets => public}/1-3.svg (100%)
 rename {src/assets => public}/banner.png (100%)
 rename {src/assets => public}/css/normalize.min.css (100%)
 rename {src/assets => public}/favicon.ico (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-Bold.ttf (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-Bold.woff (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-Bold.woff2 (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-BoldItalic.ttf (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-BoldItalic.woff (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-BoldItalic.woff2 (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-Italic.ttf (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-Italic.woff (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-Italic.woff2 (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-Medium.ttf (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-Medium.woff (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-Medium.woff2 (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-MediumItalic.ttf (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-MediumItalic.woff (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-MediumItalic.woff2 (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-Regular.ttf (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-Regular.woff (100%)
 rename {src/assets => public}/fonts/roboto/Roboto-Regular.woff2 (100%)
 rename {src/assets => public}/fonts/roboto/roboto.css (100%)
 rename {src/assets => public}/logo_dark.svg (100%)
 rename {src/assets => public}/logo_grey.svg (100%)
 rename {src/assets => public}/logo_light.svg (100%)
 rename {src/assets => public}/none.svg (100%)
 create mode 100644 public/robots.txt
 rename src/{assets => utils}/icons.js (100%)

diff --git a/.eslintignore b/.eslintignore
index 807b3864..90bcda3a 100644
--- a/.eslintignore
+++ b/.eslintignore
@@ -1,6 +1,7 @@
 build/
 dist/
-docker/
 docs/
 node_modules/
 reports/
+public/
+.cache/
\ No newline at end of file
diff --git a/src/assets/1-1.svg b/public/1-1.svg
similarity index 100%
rename from src/assets/1-1.svg
rename to public/1-1.svg
diff --git a/src/assets/1-2.svg b/public/1-2.svg
similarity index 100%
rename from src/assets/1-2.svg
rename to public/1-2.svg
diff --git a/src/assets/1-3.svg b/public/1-3.svg
similarity index 100%
rename from src/assets/1-3.svg
rename to public/1-3.svg
diff --git a/src/assets/banner.png b/public/banner.png
similarity index 100%
rename from src/assets/banner.png
rename to public/banner.png
diff --git a/src/assets/css/normalize.min.css b/public/css/normalize.min.css
similarity index 100%
rename from src/assets/css/normalize.min.css
rename to public/css/normalize.min.css
diff --git a/src/assets/favicon.ico b/public/favicon.ico
similarity index 100%
rename from src/assets/favicon.ico
rename to public/favicon.ico
diff --git a/src/assets/fonts/roboto/Roboto-Bold.ttf b/public/fonts/roboto/Roboto-Bold.ttf
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-Bold.ttf
rename to public/fonts/roboto/Roboto-Bold.ttf
diff --git a/src/assets/fonts/roboto/Roboto-Bold.woff b/public/fonts/roboto/Roboto-Bold.woff
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-Bold.woff
rename to public/fonts/roboto/Roboto-Bold.woff
diff --git a/src/assets/fonts/roboto/Roboto-Bold.woff2 b/public/fonts/roboto/Roboto-Bold.woff2
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-Bold.woff2
rename to public/fonts/roboto/Roboto-Bold.woff2
diff --git a/src/assets/fonts/roboto/Roboto-BoldItalic.ttf b/public/fonts/roboto/Roboto-BoldItalic.ttf
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-BoldItalic.ttf
rename to public/fonts/roboto/Roboto-BoldItalic.ttf
diff --git a/src/assets/fonts/roboto/Roboto-BoldItalic.woff b/public/fonts/roboto/Roboto-BoldItalic.woff
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-BoldItalic.woff
rename to public/fonts/roboto/Roboto-BoldItalic.woff
diff --git a/src/assets/fonts/roboto/Roboto-BoldItalic.woff2 b/public/fonts/roboto/Roboto-BoldItalic.woff2
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-BoldItalic.woff2
rename to public/fonts/roboto/Roboto-BoldItalic.woff2
diff --git a/src/assets/fonts/roboto/Roboto-Italic.ttf b/public/fonts/roboto/Roboto-Italic.ttf
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-Italic.ttf
rename to public/fonts/roboto/Roboto-Italic.ttf
diff --git a/src/assets/fonts/roboto/Roboto-Italic.woff b/public/fonts/roboto/Roboto-Italic.woff
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-Italic.woff
rename to public/fonts/roboto/Roboto-Italic.woff
diff --git a/src/assets/fonts/roboto/Roboto-Italic.woff2 b/public/fonts/roboto/Roboto-Italic.woff2
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-Italic.woff2
rename to public/fonts/roboto/Roboto-Italic.woff2
diff --git a/src/assets/fonts/roboto/Roboto-Medium.ttf b/public/fonts/roboto/Roboto-Medium.ttf
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-Medium.ttf
rename to public/fonts/roboto/Roboto-Medium.ttf
diff --git a/src/assets/fonts/roboto/Roboto-Medium.woff b/public/fonts/roboto/Roboto-Medium.woff
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-Medium.woff
rename to public/fonts/roboto/Roboto-Medium.woff
diff --git a/src/assets/fonts/roboto/Roboto-Medium.woff2 b/public/fonts/roboto/Roboto-Medium.woff2
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-Medium.woff2
rename to public/fonts/roboto/Roboto-Medium.woff2
diff --git a/src/assets/fonts/roboto/Roboto-MediumItalic.ttf b/public/fonts/roboto/Roboto-MediumItalic.ttf
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-MediumItalic.ttf
rename to public/fonts/roboto/Roboto-MediumItalic.ttf
diff --git a/src/assets/fonts/roboto/Roboto-MediumItalic.woff b/public/fonts/roboto/Roboto-MediumItalic.woff
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-MediumItalic.woff
rename to public/fonts/roboto/Roboto-MediumItalic.woff
diff --git a/src/assets/fonts/roboto/Roboto-MediumItalic.woff2 b/public/fonts/roboto/Roboto-MediumItalic.woff2
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-MediumItalic.woff2
rename to public/fonts/roboto/Roboto-MediumItalic.woff2
diff --git a/src/assets/fonts/roboto/Roboto-Regular.ttf b/public/fonts/roboto/Roboto-Regular.ttf
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-Regular.ttf
rename to public/fonts/roboto/Roboto-Regular.ttf
diff --git a/src/assets/fonts/roboto/Roboto-Regular.woff b/public/fonts/roboto/Roboto-Regular.woff
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-Regular.woff
rename to public/fonts/roboto/Roboto-Regular.woff
diff --git a/src/assets/fonts/roboto/Roboto-Regular.woff2 b/public/fonts/roboto/Roboto-Regular.woff2
similarity index 100%
rename from src/assets/fonts/roboto/Roboto-Regular.woff2
rename to public/fonts/roboto/Roboto-Regular.woff2
diff --git a/src/assets/fonts/roboto/roboto.css b/public/fonts/roboto/roboto.css
similarity index 100%
rename from src/assets/fonts/roboto/roboto.css
rename to public/fonts/roboto/roboto.css
diff --git a/src/assets/logo_dark.svg b/public/logo_dark.svg
similarity index 100%
rename from src/assets/logo_dark.svg
rename to public/logo_dark.svg
diff --git a/src/assets/logo_grey.svg b/public/logo_grey.svg
similarity index 100%
rename from src/assets/logo_grey.svg
rename to public/logo_grey.svg
diff --git a/src/assets/logo_light.svg b/public/logo_light.svg
similarity index 100%
rename from src/assets/logo_light.svg
rename to public/logo_light.svg
diff --git a/src/assets/none.svg b/public/none.svg
similarity index 100%
rename from src/assets/none.svg
rename to public/none.svg
diff --git a/public/robots.txt b/public/robots.txt
new file mode 100644
index 00000000..1f53798b
--- /dev/null
+++ b/public/robots.txt
@@ -0,0 +1,2 @@
+User-agent: *
+Disallow: /
diff --git a/server/config.yml b/server/config.yml
index 3b7a54b6..7e9d877f 100644
--- a/server/config.yml
+++ b/server/config.yml
@@ -4,10 +4,10 @@
 host: 127.0.0.1
 port: 8000
 
-favicon: src/assets/favicon.ico
+favicon: public/favicon.ico
 
 static:
-  /assets: src/assets
+  /: public
   /locales: src/locales
   development:
     /build: build
diff --git a/server/local_config.yml.example b/server/local_config.yml.example
index 07979813..137afd26 100644
--- a/server/local_config.yml.example
+++ b/server/local_config.yml.example
@@ -1,5 +1,6 @@
 ---
 
 serverUrl: http://127.0.0.1:9100
-
+socketUrl: ws://127.0.0.1:9100/v1/io
 apiVersion: v1
+
diff --git a/server/render-page.js b/server/render-page.js
index 1c364eda..25e0d3f9 100644
--- a/server/render-page.js
+++ b/server/render-page.js
@@ -19,19 +19,22 @@ const readManifest = (file, prefix = '/dist') => {
 };
 
 const renderPage = (options = {}) => {
-  Object.assign(defaultOptions, options);
+  options = Object.assign({}, defaultOptions, options);
 
-  const isProd = !!options.isProd;
+  const isProd = Boolean(options.isProd);
   const bundlePrefix = isProd ? '/dist' : '/build';
+  let manifest = {};
 
-  const manifest = readManifest('build-hash.json');
+  if (isProd) {
+    manifest = readManifest('build-hash.json', bundlePrefix);
+  }
 
   const normalizeCssFilePath = css_file => {
     if (css_file.startsWith('http')) {
       return css_file;
     }
     if (css_file.startsWith('/css')) {
-      return `/assets${css_file}`;
+      return `/${css_file}`;
     }
 
     if (isProd) {
@@ -71,14 +74,15 @@ const renderPage = (options = {}) => {
   };
 
   return `<!doctype html>
-<html>
+<html lang="en">
   <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
+    <meta name="Description" content="OpenPitrix: Application Management Platform on Multi-Cloud Environment">
     <title>${options.title}</title>
-    <link rel="shortcut icon" href="/assets/favicon.ico" />
-    <link rel="stylesheet" href="/assets/css/normalize.min.css" />
-    <link rel="stylesheet" href="/assets/fonts/roboto/roboto.css" />
+    <link rel="shortcut icon" href="/favicon.ico" />
+    <link rel="stylesheet" href="/css/normalize.min.css" />
+    <link rel="stylesheet" href="/fonts/roboto/roboto.css" />
     
     ${renderCss(isProd && 'bundle.css')}
   </head>
diff --git a/src/components/Banner/index.jsx b/src/components/Banner/index.jsx
index 0cdbc1a3..f1f50c94 100644
--- a/src/components/Banner/index.jsx
+++ b/src/components/Banner/index.jsx
@@ -25,9 +25,9 @@ class Banner extends PureComponent {
     return (
       <div className={classnames('banner', styles.banner)}>
         <div className={styles.wrapper}>
-          <img className="banner-img-1" src="/assets/1-1.svg" alt="" />
-          <img className="banner-img-2" src="/assets/1-2.svg" alt="" />
-          <img className="banner-img-3" src="/assets/1-3.svg" alt="" />
+          <img className="banner-img-1" src="/1-1.svg" alt="" />
+          <img className="banner-img-2" src="/1-2.svg" alt="" />
+          <img className="banner-img-3" src="/1-3.svg" alt="" />
           <div className={styles.title}>{t('brand.slogan')}</div>
           <Input.Search
             className={styles.search}
diff --git a/src/components/Base/Icon/index.jsx b/src/components/Base/Icon/index.jsx
index a6a0b50a..890cf2b1 100644
--- a/src/components/Base/Icon/index.jsx
+++ b/src/components/Base/Icon/index.jsx
@@ -3,9 +3,9 @@ import PropTypes from 'prop-types';
 import classNames from 'classnames';
 import { isNumber, noop } from 'lodash';
 
-import styles from './index.scss';
+import svgSprite from 'utils/icons';
 
-import svgSprite from 'assets/icons';
+import './index.scss';
 
 const prepend = (el, target) => {
   if (target.firstChild) {
diff --git a/src/components/Base/Icon/index.scss b/src/components/Base/Icon/index.scss
index a73cf565..7836350b 100644
--- a/src/components/Base/Icon/index.scss
+++ b/src/components/Base/Icon/index.scss
@@ -59,12 +59,4 @@
     }
   }
 
-  // styles from alert component
-  //.icon {
-  //  --icon-status-info: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNLTMtM2gyNHYyNEgtM3oiLz48cGF0aCBmaWxsPSIjMjE5MUNBIiBkPSJNOSAxOEE5IDkgMCAxIDEgOSAwYTkgOSAwIDAgMSAwIDE4ek05IDUuNjgxYTEuMzEyIDEuMzEyIDAgMSAwIDAtMi42MjMgMS4zMTIgMS4zMTIgMCAwIDAgMCAyLjYyM3pNOCA3LjUxNlYxNWgyVjcuNTE2SDh6Ii8+PC9nPjwvc3ZnPg==');
-  //  --icon-status-success: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNLTMtM2gyNHYyNEgtM3oiLz48cGF0aCBmaWxsPSIjMDBBQTcyIiBkPSJNOSAxOEE5IDkgMCAxIDEgOSAwYTkgOSAwIDAgMSAwIDE4em0tMi4xMTUtNi45NEw0LjQ5NCA4LjY3bC0xLjQxNSAxLjQxNCAzLjgwNiAzLjgwNiA3LjU0OC03LjU0OC0xLjQxNC0xLjQxNC02LjEzNCA2LjEzNHoiLz48L2c+PC9zdmc+');
-  //  --icon-status-warning: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIxOCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNLTItM2gyNHYyNEgtMnoiLz48cGF0aCBmaWxsPSIjRjVDNDE0IiBkPSJNMTAgMGwxMCAxNy4zMkgwTDEwIDB6bTAgMTYuMDAxYTEgMSAwIDEgMCAwLTIgMSAxIDAgMCAwIDAgMnpNOSA2bC4yIDdoMS42bC4yLTdIOXoiLz48L2c+PC9zdmc+');
-  //  --icon-status-error: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOCIgaGVpZ2h0PSIxOCI+PGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj48cGF0aCBkPSJNLTMtM2gyNHYyNEgtM3oiLz48cGF0aCBmaWxsPSIjQ0EyNjIxIiBkPSJNMTIuNzI4IDBMMTggNS4yNzJ2Ny40NTZMMTIuNzI4IDE4SDUuMjcyTDAgMTIuNzI4VjUuMjcyTDUuMjcyIDBoNy40NTZ6bS0yLjMxNCA5bDMuNDY2LTMuNDY2LTEuNDE0LTEuNDE0TDkgNy41ODYgNS41MzYgNC4xMjIgNC4xMjIgNS41MzYgNy41ODYgOSA0LjEyIDEyLjQ2NmwxLjQxNCAxLjQxNEw5IDEwLjQxNGwzLjQ2NCAzLjQ2NCAxLjQxNC0xLjQxNEwxMC40MTQgOXoiLz48cGF0aCBmaWxsPSIjRkZGIiBkPSJNMTAuNDE0IDlsMy40NjQgMy40NjQtMS40MTQgMS40MTRMOSAxMC40MTQgNS41MzQgMTMuODggNC4xMiAxMi40NjYgNy41ODYgOSA0LjEyMiA1LjUzNmwxLjQxNC0xLjQxNEw5IDcuNTg2bDMuNDY2LTMuNDY2IDEuNDE0IDEuNDE0eiIvPjwvZz48L3N2Zz4=');
-  //}
-
 }
diff --git a/src/components/Base/Image/index.jsx b/src/components/Base/Image/index.jsx
index b4e73b50..ddc19ac8 100644
--- a/src/components/Base/Image/index.jsx
+++ b/src/components/Base/Image/index.jsx
@@ -43,7 +43,7 @@ export default class Image extends React.Component {
     const { failed } = this.state;
 
     if (failed) {
-      const nonIcon = '/assets/none.svg';
+      const nonIcon = '/none.svg';
       const sizeStyle = {
         width: iconSize + 'px',
         height: iconSize + 'px'
diff --git a/src/components/Card/index.jsx b/src/components/Card/index.jsx
index 64884409..560fc50f 100644
--- a/src/components/Card/index.jsx
+++ b/src/components/Card/index.jsx
@@ -17,7 +17,7 @@ export default class Card extends PureComponent {
   render() {
     const { icon, name, desc, fold } = this.props;
     const iconSize = fold ? 36 : 48;
-    const noneIcon = '/assets/none.svg';
+    const noneIcon = '/none.svg';
 
     return (
       <div className={classnames(styles.card, { [styles.foldCard]: fold })}>
diff --git a/src/components/Footer/index.jsx b/src/components/Footer/index.jsx
index fdcaa135..f20cc520 100644
--- a/src/components/Footer/index.jsx
+++ b/src/components/Footer/index.jsx
@@ -24,11 +24,11 @@ export default class Footer extends PureComponent {
         <div className={styles.wrapper}>
           <div className={styles.inner}>
             <span className={styles.logo}>
-              <img src="/assets/logo_grey.svg" alt="logo" height="100%" />
+              <img src="/logo_grey.svg" alt="logo" height="100%" />
             </span>
             <ul className={styles.terms}>
               <li>
-                <a target="_blank" href="https://openpitrix.io">
+                <a target="_blank" href="https://openpitrix.io" rel="noreferrer">
                   {t('About')}
                 </a>
                 {/* <span className={styles.dot} />
@@ -45,7 +45,7 @@ export default class Footer extends PureComponent {
                 >
                   中文
                 </a>
-                <span className={styles.dot}/>
+                <span className={styles.dot} />
                 <a
                   href="#"
                   onClick={this.changeLocale.bind(null, 'en')}
diff --git a/src/components/Header/index.jsx b/src/components/Header/index.jsx
index 2dd1c8fd..e3782fd3 100644
--- a/src/components/Header/index.jsx
+++ b/src/components/Header/index.jsx
@@ -74,7 +74,7 @@ class Header extends Component {
       rootStore: { fixNav }
     } = this.props;
     const isDark = !isHome || fixNav;
-    const logoUrl = isDark ? '/assets/logo_light.svg' : '/assets/logo_dark.svg';
+    const logoUrl = isDark ? '/logo_light.svg' : '/logo_dark.svg';
     const needShowSearch = isDark && isHome;
     const appSearch = match.params.search;
 
diff --git a/src/components/Nav/index.jsx b/src/components/Nav/index.jsx
index 23f8e620..fcbafe56 100644
--- a/src/components/Nav/index.jsx
+++ b/src/components/Nav/index.jsx
@@ -22,8 +22,8 @@ export default class Nav extends PureComponent {
 
     return (
       <div className={classnames(styles.nav, className)}>
+        <p className={styles.caption}>{t('Categories')}</p>
         <ul className={styles.subNav}>
-          <p>{t('Categories')}</p>
           {navs.map(nav => (
             <li key={nav.category_id}>
               <NavLink
diff --git a/src/components/Nav/index.scss b/src/components/Nav/index.scss
index 1485c125..df2aab73 100644
--- a/src/components/Nav/index.scss
+++ b/src/components/Nav/index.scss
@@ -2,6 +2,15 @@
 
 .nav {
   padding-top: 32px;
+
+  .caption {
+    margin: 0 0 20px;
+    line-height: 20px;
+    font-size: $font16;
+    font-weight: bold;
+    color: $N500;
+  }
+
   .subNav {
     padding: 0;
     margin-top: $base-margin;
@@ -9,13 +18,7 @@
     &:first-of-type {
       margin-top: 0;
     }
-    p {
-      margin: 0 0 20px;
-      line-height: 20px;
-      font-size: $font16;
-      font-weight: bold;
-      color: $N500;
-    }
+
     li {
       margin: 12px 0;
       height: 20px;
diff --git a/src/components/Rectangle/AppImages/index.jsx b/src/components/Rectangle/AppImages/index.jsx
index fc947819..e6f4d979 100644
--- a/src/components/Rectangle/AppImages/index.jsx
+++ b/src/components/Rectangle/AppImages/index.jsx
@@ -16,7 +16,7 @@ export default class AppImages extends Component {
 
   render() {
     const { apps, total, t } = this.props;
-    const nonIcon = '/assets/none.svg';
+    const nonIcon = '/none.svg';
 
     return (
       <div className={styles.appImages}>
diff --git a/src/components/TdName/index.jsx b/src/components/TdName/index.jsx
index ca376beb..ac0321a8 100644
--- a/src/components/TdName/index.jsx
+++ b/src/components/TdName/index.jsx
@@ -49,7 +49,7 @@ export default class TdName extends React.Component {
   renderIcon() {
     const { noIcon, image } = this.props;
     const isIcon = ['appcenter', 'cluster'].includes(image);
-    const nonIcon = '/assets/none.svg';
+    const nonIcon = '/none.svg';
 
     if (noIcon) {
       return null;
diff --git a/src/pages/AppDetail/Meta/index.jsx b/src/pages/AppDetail/Meta/index.jsx
index 541f0b80..efe13b76 100644
--- a/src/pages/AppDetail/Meta/index.jsx
+++ b/src/pages/AppDetail/Meta/index.jsx
@@ -7,7 +7,7 @@ import { get } from 'lodash';
 import styles from './index.scss';
 
 const Meta = ({ app }) => {
-  const iconSrc = '/assets/None48.svg';
+  const iconSrc = '/none.svg';
 
   return (
     <div className={styles.meta}>
diff --git a/src/pages/Login/index.jsx b/src/pages/Login/index.jsx
index 4d6ad847..56a1bade 100644
--- a/src/pages/Login/index.jsx
+++ b/src/pages/Login/index.jsx
@@ -28,7 +28,7 @@ export default class Login extends Component {
       <div className={styles.login}>
         <div className={styles.loginContent}>
           <div className={styles.loginTitle}>
-            <Logo url="/assets/logo_light.svg" />
+            <Logo url="/logo_light.svg" />
           </div>
           <div className={styles.loginForm}>
             <h1>{t('Login OpenPitrix')}</h1>
diff --git a/src/assets/icons.js b/src/utils/icons.js
similarity index 100%
rename from src/assets/icons.js
rename to src/utils/icons.js
diff --git a/test/pages/__snapshots__/Home.test.js.snap b/test/pages/__snapshots__/Home.test.js.snap
index 8c5f761b..c9bfbee5 100644
--- a/test/pages/__snapshots__/Home.test.js.snap
+++ b/test/pages/__snapshots__/Home.test.js.snap
@@ -10,11 +10,12 @@ exports[`Home basic render 1`] = `
     <div
       class="nav nav"
     >
+      <p
+        class="caption"
+      />
       <ul
         class="subNav"
-      >
-        <p />
-      </ul>
+      />
     </div>
     <div
       class="appList apps"
diff --git a/webpack.prod.js b/webpack.prod.js
index e3e88e97..1f9f8671 100644
--- a/webpack.prod.js
+++ b/webpack.prod.js
@@ -45,12 +45,12 @@ const clientConfig = {
       {
         test: /\.(jpg|png|svg)(\?.+)?$/,
         use: 'url-loader?limit=100000',
-        include: [resolve(__dirname, 'src/assets'), resolve(__dirname, 'src/components')]
+        include: [resolve(__dirname, 'public'), resolve(__dirname, 'src/components')]
       },
       {
         test: /\.(ttf|otf|eot|woff2?)(\?.+)?$/,
         use: 'file-loader',
-        include: [resolve(__dirname, 'src/assets'), resolve(__dirname, 'src/components')]
+        include: [resolve(__dirname, 'public'), resolve(__dirname, 'src/components')]
       },
       {
         test: /\.scss$/,
@@ -89,7 +89,6 @@ const clientConfig = {
       filename: 'bundle.css',
       allChunks: true
     }),
-    // new webpack.NamedModulesPlugin(),
     new WriteHashPlugin(),
     // new webpack.optimize.OccurrenceOrderPlugin(),
     // new webpack.optimize.UglifyJsPlugin({
@@ -139,7 +138,7 @@ const serverConfig = {
       {
         test: /\.(jpg|png|svg)(\?.+)?$/,
         loader: 'url-loader?limit=100000',
-        include: [resolve(__dirname, 'src/assets'), resolve(__dirname, 'src/components')],
+        include: [resolve(__dirname, 'public'), resolve(__dirname, 'src/components')],
         options: {
           emit: false // don't copy the files
         }
@@ -147,7 +146,7 @@ const serverConfig = {
       {
         test: /\.(ttf|otf|eot|woff2?)(\?.+)?$/,
         loader: 'file-loader',
-        include: [resolve(__dirname, 'src/assets'), resolve(__dirname, 'src/components')],
+        include: [resolve(__dirname, 'public'), resolve(__dirname, 'src/components')],
         options: {
           emit: false
         }