feat: enable custom theme with eject

bin/munseo.js

@@ -4,7 +4,7 @@ const chalk = require('chalk');
 const semver = require('semver');
 const path = require('path');
 const program = require('commander');
-const {build, init, start} = require('../lib');
+const {build, eject, init, start} = require('../lib');
 const requiredVersion = require('../package.json').engines.node;
 
 if (!semver.satisfies(process.version, requiredVersion)) {
@@ -42,6 +42,13 @@ program
     wrapCommand(build)(path.resolve(siteDir), {skipImageCompression});
   });
 
+program
+  .command('eject [siteDir]')
+  .description('copy the default theme into website folder for customization.')
+  .action((siteDir = '.') => {
+    wrapCommand(eject)(path.resolve(siteDir));
+  });
+
 program
   .command('init [projectDir]')
   .description('Initialize website')

lib/commands/eject.js

@@ -0,0 +1,16 @@
+const fs = require('fs-extra');
+const chalk = require('chalk');
+const path = require('path');
+
+module.exports = async function eject(siteDir) {
+  const defaultTheme = path.resolve(__dirname, '..', 'theme');
+  const customTheme = path.resolve(siteDir, 'theme');
+  await fs.copy(defaultTheme, customTheme);
+
+  const relativeDir = path.relative(process.cwd(), customTheme);
+  console.log(
+    `\n${chalk.green('Success!')} Copied default theme files to ${chalk.cyan(
+      relativeDir
+    )}.\n`
+  );
+};

lib/index.js

@@ -1,9 +1,11 @@
 const build = require('./commands/build');
 const init = require('./commands/init');
 const start = require('./commands/start');
+const eject = require('./commands/eject');
 
 module.exports = {
   build,
+  eject,
   init,
   start
 };

lib/load/config.js

@@ -20,7 +20,6 @@ module.exports = function loadConfig(siteDir, deleteCache = true) {
   ];
   const optionalFields = [
     'customDocsPath',
-    'themePath',
     'highlight',
     'markdownPlugins'
   ];

lib/load/index.js

@@ -34,11 +34,19 @@ module.exports = async function load(siteDir) {
   const outDir = path.resolve(siteDir, 'build');
 
   // resolve the theme
-  const themePath =
-    siteConfig.themePath &&
-    fs.existsSync(path.resolve(siteDir, siteConfig.themePath))
-      ? siteConfig.themePath
-      : path.resolve(__dirname, '../theme');
+  const customThemePath = path.resolve(siteDir, 'theme');
+  const themePath = fs.existsSync(customThemePath)
+    ? customThemePath
+    : path.resolve(__dirname, '../theme');
+
+  const themeComponents = ['Docs', 'Loading', 'NotFound'];
+  themeComponents.forEach(component => {
+    if (!require.resolve(path.join(themePath, component))) {
+      throw new Error(
+        `Failed to load ${themePath}/${component}. It does not exist.`
+      );
+    }
+  });
 
   const baseUrl = siteConfig.baseUrl || '/';
 

package.json

@@ -10,6 +10,7 @@
     "munseo": "node bin/munseo",
     "start": "node bin/munseo start website",
     "build": "node bin/munseo build website",
+    "eject": "node bin/munseo eject website",
     "prettier": "prettier --config .prettierrc --write \"lib/**/*.js\" \"bin/**/*.js\" \"test/**/*.js\"",
     "lint": "eslint --cache \"lib/**/*.js\" \"bin/**/*.js\" \"test/**/*.js\"",
     "test": "jest --config test/jest.config.js"