feat(antdsite): add theme.

Author: wangyi7099

packages/antdsite/index.js

@@ -1,30 +1 @@
-/* eslint no-console:0 */
-function camelCase(name) {
-  return (
-    name.charAt(0).toUpperCase() +
-    name.slice(1).replace(/-(\w)/g, (m, n) => {
-      return n.toUpperCase();
-    })
-  );
-}
-
-// Just import style for https://github.com/ant-design/ant-design/issues/3745
-const req = require.context('./components', true, /^\.\/[^_][\w-]+\/style\/index\.tsx?$/);
-
-req.keys().forEach(mod => {
-  let v = req(mod);
-  if (v && v.default) {
-    v = v.default;
-  }
-  const match = mod.match(/^\.\/([^_][\w-]+)\/index\.tsx?$/);
-  if (match && match[1]) {
-    if (match[1] === 'message' || match[1] === 'notification') {
-      // message & notification should not be capitalized
-      exports[match[1]] = v;
-    } else {
-      exports[camelCase(match[1])] = v;
-    }
-  }
-});
-
-module.exports = require('./components');
+export { PageContext } from './templates/PageContext';

packages/antdsite/lib/gatsby/createPages.js

@@ -13,7 +13,8 @@ const path = require('path');
 function isHome(frontmatter, slug) {
   return (
     frontmatter.home === true &&
-    ((themeConfig.locales && Object.keys(themeConfig.locales).indexOf(slug) !== -1) || slug === '/')
+    ((themeConfig.locales && Object.keys(themeConfig.locales).indexOf(slug) !== -1) ||
+      slug === webConfig.base)
   );
 }
 
@@ -27,8 +28,7 @@ module.exports = async ({ graphql, actions }) => {
   const { createPage, createRedirect } = actions;
   // Used to detect and prevent duplicate redirects
 
-  const docsTemplate = resolve(__dirname, '../../src/templates/docs.tsx');
-  const indexTemplate = resolve(__dirname, '../../src/templates/home.tsx');
+  const template = resolve(__dirname, '../../src/templates/index.tsx');
 
   // Redirect /index.html to root.
   createRedirect({
@@ -70,37 +70,32 @@ module.exports = async ({ graphql, actions }) => {
   edges.forEach(edge => {
     const { fields, frontmatter } = edge.node;
     const { slug } = fields;
-    if (!isHome(frontmatter, slug)) {
-      if (frontmatter.home === true) {
-        redirects[resolveDirPath(slug)] = slug;
-        redirects[resolveDirPath(slug, true)] = slug;
-      }
+    let isWebsiteHome = false;
+
+    if (isHome(frontmatter, slug)) {
+      isWebsiteHome = true;
+    }
 
-      const createArticlePage = path => {
-        return createPage({
-          path,
-          component: docsTemplate,
-          context: {
-            webConfig,
-            slug,
-            maxTocDeep: frontmatter.maxTocDeep || webConfig.themeConfig.maxTocDeep,
-          },
-        });
-      };
-
-      // Register primary URL.
-      createArticlePage(slug);
-    } else {
-      createPage({
-        path: slug,
-        component: indexTemplate,
+    if (frontmatter.home === true && !isWebsiteHome) {
+      redirects[resolveDirPath(slug)] = slug;
+      redirects[resolveDirPath(slug, true)] = slug;
+    }
+
+    const createArticlePage = path => {
+      return createPage({
+        path,
+        component: template,
         context: {
+          isWebsiteHome,
           webConfig,
           slug,
-          maxTocDeep: webConfig.themeConfig.maxTocDeep,
+          maxTocDeep: frontmatter.maxTocDeep || webConfig.themeConfig.maxTocDeep,
         },
       });
-    }
+    };
+
+    // Register primary URL.
+    createArticlePage(slug);
   });
 
   Object.keys(redirects).map(path => {

packages/antdsite/lib/gatsby/onCreateWebpackConfig.js

@@ -1,4 +1,7 @@
-module.exports = ({ stage, actions, loaders, getConfig }) => {
+const { resolveLayouts } = require('../util');
+
+module.exports = ({ stage, actions, loaders }) => {
+  resolveLayouts(actions);
   if (stage === 'develop') {
     actions.setWebpackConfig({
       module: {

packages/antdsite/lib/util.js

@@ -1,8 +1,11 @@
 const path = require('path');
 const defaultConfig = require(path.resolve(__dirname, '../__default__/default-config'));
 const chalk = require('chalk');
+const fs = require('fs');
+
+const configName = '.antdsite/config.js';
+const themeName = '.antdsite/theme';
 
-const configName = '.antdsite.js';
 let userConfig;
 
 module.exports.getUserConfig = () => {
@@ -92,3 +95,35 @@ function validateConfig(config) {
     }
   }
 }
+
+function componentExist(path) {
+  return (
+    fs.existsSync(path + '.js') ||
+    fs.existsSync(path + '.jsx') ||
+    fs.existsSync(path + '.ts') ||
+    fs.existsSync(path + '.tsx')
+  );
+}
+
+function getLayoutPath(layoutName) {
+  const userDefinedLayout = path.resolve(process.cwd(), `${themeName}/layout/${layoutName}`);
+  if (componentExist(userDefinedLayout)) {
+    return userDefinedLayout;
+  } else {
+    return path.resolve(__dirname, `../src/default-theme/layout/${layoutName}.tsx`);
+  }
+}
+
+module.exports.resolveLayouts = function(actions) {
+  const allLayouts = ['layout', 'header', 'home', 'footer', 'main-content'];
+  allLayouts.forEach(layout => {
+    const layoutPath = getLayoutPath(layout);
+    actions.setWebpackConfig({
+      resolve: {
+        alias: {
+          [`antdsite-${layout}`]: layoutPath,
+        },
+      },
+    });
+  });
+};