feat: webpack config creator

lib/webpack/base.js

@@ -1,8 +1,10 @@
 const Config = require('webpack-chain');
 const path = require('path');
 
+const mdLoader = require.resolve('./loader/markdown');
+
 module.exports = function createBaseConfig(props) {
-  const {outDir, uiPath, siteDir, baseUrl} = props;
+  const {siteConfig, outDir, themePath, siteDir, baseUrl} = props;
 
   const config = new Config();
   const isProd = process.env.NODE_ENV === 'production';
@@ -10,39 +12,50 @@ module.exports = function createBaseConfig(props) {
   config
     .mode(isProd ? 'production' : 'development')
     .output.path(outDir)
-    .filename(
+    .filename(isProd ? 'bundle.js' : '[name].js')
-      isProd ? 'static/js/[name].[chunkhash].js' : 'static/js/[name].js'
-    )
     .publicPath(isProd ? baseUrl : '/');
 
   config.resolve
     .set('symlinks', true)
-    .alias.set('@ui', uiPath)
+    .alias.set('@theme', themePath)
-    .set('@source', siteDir)
+    .set('@site', siteDir)
-    .set('@generated', path.resolve(__dirname, '../generated'))
+    .set('@generated', path.resolve(__dirname, '../core/generated'))
     .set('@core', path.resolve(__dirname, '../core'))
     .end();
 
-  const libDir = path.join(__dirname, '..');
+  function applyBabel(rule) {
-  config.module
+    rule
+      .use('babel')
+      .loader('babel-loader')
+      .options({
+        babelrc: false,
+        presets: ['env', 'react']
+      });
+  }
+
+  const jsRule = config.module
     .rule('js')
     .test(/\.js$/)
     .exclude.add(filepath => {
       // Always transpile lib directory
-      if (filepath.startsWith(libDir)) {
+      if (filepath.startsWith(path.join(__dirname, '..'))) {
         return false;
       }
       // Don't transpile node_modules
       return /node_modules/.test(filepath);
     })
-    .end()
+    .end();
-    .use('babel')
+
-    .loader('babel-loader')
+  applyBabel(jsRule);
-    .options({
+
-      // do not pick local project babel config
+  const mdRule = config.module.rule('markdown').test(/\.md$/);
-      babelrc: false,
+
-      presets: ['env', 'react']
+  applyBabel(mdRule);
-    });
+
+  mdRule
+    .use('markdown-loader')
+    .loader(mdLoader)
+    .options({siteConfig});
 
   return config;
 };

lib/webpack/config/base.js

@@ -1,48 +0,0 @@
-const Config = require('webpack-chain');
-const path = require('path');
-
-module.exports = function createBaseConfig(props) {
-  const {outDir, themePath, siteDir, baseUrl} = props;
-
-  const config = new Config();
-  const isProd = process.env.NODE_ENV === 'production';
-
-  config
-    .mode(isProd ? 'production' : 'development')
-    .output.path(outDir)
-    .filename(
-      isProd ? 'static/js/[name].[chunkhash].js' : 'static/js/[name].js'
-    )
-    .publicPath(isProd ? baseUrl : '/');
-
-  config.resolve
-    .set('symlinks', true)
-    .alias.set('@theme', themePath)
-    .set('@site', siteDir)
-    .set('@generated', path.resolve(__dirname, '../core/generated'))
-    .set('@core', path.resolve(__dirname, '../core'))
-    .end();
-
-  const libDir = path.join(__dirname, '..');
-  config.module
-    .rule('js')
-    .test(/\.js$/)
-    .exclude.add(filepath => {
-      // Always transpile lib directory
-      if (filepath.startsWith(libDir)) {
-        return false;
-      }
-      // Don't transpile node_modules
-      return /node_modules/.test(filepath);
-    })
-    .end()
-    .use('babel')
-    .loader('babel-loader')
-    .options({
-      // do not pick local project babel config
-      babelrc: false,
-      presets: ['env', 'react']
-    });
-
-  return config;
-};

lib/webpack/config/dev.js

@@ -1,10 +0,0 @@
-const path = require('path');
-const createBaseConfig = require('./base');
-
-module.exports = function createDevConfig(props) {
-  const config = createBaseConfig(props);
-
-  config.entry('main').add(path.resolve(__dirname, '../core/devEntry.js'));
-
-  return config;
-};

lib/webpack/config/prod.js

@@ -1,12 +0,0 @@
-const path = require('path');
-const createBaseConfig = require('./base');
-
-module.exports = function createProdConfig(props) {
-  const config = createBaseConfig(props);
-
-  config.entry('main').add(path.resolve(__dirname, '../core/prodEntry.js'));
-
-  // TODO
-
-  return config;
-};

lib/webpack/dev.js

@@ -1,10 +1,10 @@
-const path = require('path');
+const path = require('path');
-const createBaseConfig = require('./base');
+const createBaseConfig = require('./base');
-
+
-module.exports = function createDevConfig(props) {
+module.exports = function createDevConfig(props) {
-  const config = createBaseConfig(props);
+  const config = createBaseConfig(props);
-
+
-  config.entry('main').add(path.resolve(__dirname, '../core/devEntry.js'));
+  config.entry('main').add(path.resolve(__dirname, '../core/devEntry.js'));
-
+
-  return config;
+  return config;
-};
+};

lib/webpack/prod.js

@@ -0,0 +1,32 @@
+const path = require('path');
+const staticSiteGeneratorPlugin = require('static-site-generator-webpack-plugin');
+const createBaseConfig = require('./base');
+
+module.exports = function createProdConfig(props) {
+  const config = createBaseConfig(props);
+
+  config.entry('main').add(path.resolve(__dirname, '../core/prodEntry.js'));
+  config.output.libraryTarget('umd');
+
+  // Workaround for Webpack 4 Bug (https://github.com/webpack/webpack/issues/6522)
+  config.output.globalObject('this');
+
+  const {siteConfig, docsData} = props;
+
+  // Find all available paths
+  const paths = docsData.map(docs => docs.path);
+
+  config.plugin('StaticSiteGenerator').use(staticSiteGeneratorPlugin, [
+    {
+      entry: 'main',
+      locals: {
+        bundlejs: 'bundle.js',
+        title: siteConfig.title || 'Munseo',
+        lang: 'en'
+      },
+      paths
+    }
+  ]);
+
+  return config;
+};