Move docs to github pages (#863)

youzan · Jun 8, 2018 · f9bfc73 · f9bfc73
1 parent e87d7fb
commit f9bfc73
Show file tree

Hide file tree

Showing 12 changed files with 188 additions and 117 deletions.
diff --git a/site/README.md b/site/README.md
@@ -15,3 +15,7 @@ npm run dev
 `yarn run deploy`
 
 默认情况下生成的静态文件会部署到当前仓库的 `gh-pages` 分支上， 可以设置 `ZENT_DEPLOY_DOC_GIT_REPO` 环境变量来修改仓库。
+
+## Notes
+
+Github doesn't support SPAs, the `404.html` is a workaround. Do NOT remove it.
diff --git a/site/assets/ZanUIlogo256x256.png b/site/assets/ZanUIlogo256x256.png
diff --git a/site/assets/zanui-logo.png b/site/assets/zanui-logo.png
diff --git a/site/package.json b/site/package.json
@@ -35,7 +35,7 @@
     "favicons-webpack-plugin": "^0.0.7",
     "file-loader": "1",
     "front-matter": "^2.2.0",
-    "gh-pages": "^0.12.0",
+    "gh-pages": "1.2.0",
     "happypack": "4.0.0",
     "html-loader": "^0.5",
     "html-webpack-plugin": "^2.28.0",

diff --git a/site/scripts/deploy.sh b/site/scripts/deploy.sh
@@ -1,25 +1,3 @@
 #!/bin/bash
 
-RED='\033[0;31m'
-basepath=$(dirname $0)
-
-fail () {
-    printf "${RED}$@\nAborting\n"
-    exit -1
-}
-
-command_exists () {
-    type "$1" >/dev/null 2>&1
-}
-
-if ! command_exists superman ; then
-    fail 'superman is required to deploy docs'
-fi
-
-if [[ -z "${ZENT_DEPLOY_DOC_GIT_REPO}" ]]; then
-  fail 'Environment variable ZENT_DEPLOY_DOC_GIT_REPO not set.'
-else
-  gh-pages -d dist -r "${ZENT_DEPLOY_DOC_GIT_REPO}"
-fi
-
-superman cdn /zanui/zent $basepath/../dist/*
+gh-pages -d dist
diff --git a/site/src/404.html b/site/src/404.html
@@ -0,0 +1,41 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Redirecting...</title>
+    <script type="text/javascript">
+      // Single Page Apps for GitHub Pages
+      // https://github.com/rafrex/spa-github-pages
+      // Copyright (c) 2016 Rafael Pedicini, licensed under the MIT License
+      // ----------------------------------------------------------------------
+      // This script takes the current url and converts the path and query
+      // string into just a query string, and then redirects the browser
+      // to the new url with only a query string and hash fragment,
+      // e.g. http://www.foo.tld/one/two?a=b&c=d#qwe, becomes
+      // http://www.foo.tld/?p=/one/two&q=a=b~and~c=d#qwe
+      // Note: this 404.html file must be at least 512 bytes for it to work
+      // with Internet Explorer (it is currently > 512 bytes)
+
+      // If you're creating a Project Pages site and NOT using a custom domain,
+      // then set segmentCount to 1 (enterprise users may need to set it to > 1).
+      // This way the code will only replace the route part of the path, and not
+      // the real directory in which the app resides, for example:
+      // https://username.github.io/repo-name/one/two?a=b&c=d#qwe becomes
+      // https://username.github.io/repo-name/?p=/one/two&q=a=b~and~c=d#qwe
+      // Otherwise, leave segmentCount as 0.
+      var segmentCount = 1;
+
+      var l = window.location;
+      l.replace(
+        l.protocol + '//' + l.hostname + (l.port ? ':' + l.port : '') +
+        l.pathname.split('/').slice(0, 1 + segmentCount).join('/') + '/?p=/' +
+        l.pathname.slice(1).split('/').slice(segmentCount).join('/').replace(/&/g, '~and~') +
+        (l.search ? '&q=' + l.search.slice(1).replace(/&/g, '~and~') : '') +
+        l.hash
+      );
+
+    </script>
+  </head>
+  <body>
+  </body>
+</html>
diff --git a/site/src/components/page-footer/index.js b/site/src/components/page-footer/index.js
@@ -51,7 +51,7 @@ export default class PageFooter extends Component {
           </li>
           <li className="page-footer__item">
             <a
-              href="//www.youzanyun.com/zanui/vant"
+              href="https://youzan.github.io/vant"
               className="page-footer__link"
             >
               {TEXT[i18n].vant}

diff --git a/site/src/constants.js b/site/src/constants.js
@@ -1,2 +1 @@
-export const prefix =
-  process.env.NODE_ENV === 'production' ? '/zanui/zent/' : '/';
+export const prefix = process.env.NODE_ENV === 'production' ? '/zent/' : '/';
diff --git a/site/src/index.html b/site/src/index.html
@@ -1,10 +1,44 @@
 <!DOCTYPE html>
 <html lang="en">
+
 <head>
   <meta charset="UTF-8" />
   <meta name="viewport" content="width=device-width, initial-scale=1" />
   <meta name="google" content="notranslate" />
   <title>Zent - 好用的React组件库</title>
+
+  <!-- Start Single Page Apps for GitHub Pages -->
+  <script type="text/javascript">
+    // Single Page Apps for GitHub Pages
+    // https://github.com/rafrex/spa-github-pages
+    // Copyright (c) 2016 Rafael Pedicini, licensed under the MIT License
+    // ----------------------------------------------------------------------
+    // This script checks to see if a redirect is present in the query string
+    // and converts it back into the correct url and adds it to the
+    // browser's history using window.history.replaceState(...),
+    // which won't cause the browser to attempt to load the new url.
+    // When the single page app is loaded further down in this file,
+    // the correct url will be waiting in the browser's history for
+    // the single page app to route accordingly.
+    (function (l) {
+      if (l.search) {
+        var q = {};
+        l.search.slice(1).split('&').forEach(function (v) {
+          var a = v.split('=');
+          q[a[0]] = a.slice(1).join('=').replace(/~and~/g, '&');
+        });
+        if (q.p !== undefined) {
+          window.history.replaceState(null, null,
+            l.pathname.slice(0, -1) + (q.p || '') +
+            (q.q ? ('?' + q.q) : '') +
+            l.hash
+          );
+        }
+      }
+    }(window.location))
+  </script>
+  <!-- End Single Page Apps for GitHub Pages -->
+
   <style>
     .loader,
     .loader:before,
@@ -15,6 +49,7 @@
       width: 1em;
       height: 4em;
     }
+
     .loader {
       color: #eee;
       text-indent: -9999em;
@@ -27,20 +62,24 @@
       -webkit-animation-delay: -0.16s;
       animation-delay: -0.16s;
     }
+
     .loader:before,
     .loader:after {
       position: absolute;
       top: 0;
       content: '';
     }
+
     .loader:before {
       left: -1.5em;
       -webkit-animation-delay: -0.32s;
       animation-delay: -0.32s;
     }
+
     .loader:after {
       left: 1.5em;
     }
+
     @-webkit-keyframes load1 {
       0%,
       80%,
@@ -53,6 +92,7 @@
         height: 5em;
       }
     }
+
     @keyframes load1 {
       0%,
       80%,
@@ -67,9 +107,11 @@
     }
   </style>
 </head>
+
 <body>
   <div id="app-container">
     <div class="loader">Loading...</div>
   </div>
 </body>
+
 </html>
diff --git a/site/webpack/webpack.config.js b/site/webpack/webpack.config.js
@@ -73,10 +73,17 @@ module.exports = {
 
     new HtmlWebpackPlugin({
       template: 'src/index.html',
-      chunks: ['vendor', 'docs', 'markdown'],
+      chunks: ['vendor', 'docs'],
       inject: 'body',
     }),
 
+    new HtmlWebpackPlugin({
+      template: 'src/404.html',
+      filename: '404.html',
+      chunks: [],
+      inject: false,
+    }),
+
     new HappyPack({
       id: 'js',
       threadPool: happyThreadPool,

diff --git a/site/webpack/webpack.prd.config.js b/site/webpack/webpack.prd.config.js
@@ -1,4 +1,3 @@
-const { resolve } = require('path');
 const webpack = require('webpack');
 const HappyPack = require('happypack');
 const vendorEntry = require('./vendor-entry');
@@ -7,7 +6,7 @@ const ExtractTextPlugin = require('extract-text-webpack-plugin');
 const FaviconsWebpackPlugin = require('favicons-webpack-plugin');
 const happyThreadPool = require('./happypack-thread-pool');
 
-const prefix = 'https://b.yzcdn.cn/zanui/zent/';
+const prefix = '/zent/';
 
 module.exports = Object.assign({}, base, {
   entry: {
@@ -29,22 +28,10 @@ module.exports = Object.assign({}, base, {
     }),
   }),
 
-  // module: Object.assign({}, base.module, {
-  //   rules: base.module.rules.concat(getRules(babelLoader), [
-  //     {
-  //       test: /\.p?css$/,
-  //       use: ExtractTextPlugin.extract({
-  //         fallback: 'style-loader',
-  //         use: ['css-loader', 'postcss-loader']
-  //       })
-  //     }
-  //   ])
-  // }),
-
   plugins: base.plugins.concat([
     new FaviconsWebpackPlugin({
       // Your source logo
-      logo: './assets/ZanUIlogo256x256.png',
+      logo: './assets/zanui-logo.png',
       // The prefix for all image files (might be a folder or a name)
       prefix: 'favico-[hash]-',
       // Emit all stats of the generated icons
@@ -53,7 +40,7 @@ module.exports = Object.assign({}, base, {
       // statsFilename: 'iconstats-[hash].json',
       // Generate a cache file with control hashes and
       // don't rebuild the favicons until those hashes change
-      persistentCache: false,
+      persistentCache: true,
       // Inject the html into the html-webpack-plugin
       inject: true,
       // favicon background color (see https://github.com/haydenbleasel/favicons#usage)
@@ -109,8 +96,4 @@ module.exports = Object.assign({}, base, {
       allChunks: true,
     }),
   ]),
-  devServer: {
-    contentBase: resolve(__dirname, 'dist'),
-    publicPath: prefix,
-  },
 });