feat: webpack-compile from react-router integration

examples/react-webpack/package.json

@@ -5,12 +5,7 @@
   "main": "index.js",
   "license": "MIT",
   "dependencies": {
-    "@component-controls/core": "^2.10.4",
     "@component-controls/react-router-integration": "^2.10.5",
-    "@component-controls/search-fusejs": "^2.10.4",
-    "@component-controls/store": "^2.10.5",
-    "@component-controls/webpack-compile": "^2.10.5",
-    "@component-controls/webpack-configs": "^2.10.5",
     "react": "^17.0.1",
     "react-dom": "^17.0.1"
   },

examples/react-webpack/webpack.config.js

@@ -1,28 +1,14 @@
-const path = require('path');
-const { defaultCompileProps } = require('@component-controls/core');
-const { getBundleName } = require('@component-controls/core/node-utils');
-const { compile, watch } = require('@component-controls/webpack-compile');
-
 const { resolve } = require('path');
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const TerserWebpackPlugin = require('terser-webpack-plugin');
 const {
-  postBuild,
-} = require('@component-controls/react-router-integration/post-build');
+  withComponentControls,
+} = require('@component-controls/react-router-integration/webpack-build');
 
 const isProd = process.env.NODE_ENV === 'production';
 
 const outFolder = process.env.BUILD_PATH || 'build';
 
-const buildOptions = {
-  ...defaultCompileProps,
-  configPath: '.config',
-  ...{
-    distFolder: process.env.DIST_PATH || path.join(process.cwd(), outFolder),
-    staticFolder:
-      process.env.STATIC_PATH || path.join(process.cwd(), outFolder, 'static'),
-  },
-};
 const config = {
   mode: isProd ? 'production' : 'development',
   entry: {
@@ -41,16 +27,7 @@ const config = {
       {
         test: /\.tsx?$/,
         use: 'babel-loader',
-        exclude: /node_modules/,
-      },
-      {
-        test: require.resolve('@component-controls/store/controls-store'),
-        use: {
-          loader: require.resolve('@component-controls/store/loader.js'),
-          options: {
-            bundleFileName: getBundleName(buildOptions),
-          },
-        },
+        include: /src/,
       },
     ],
   },
@@ -83,11 +60,8 @@ if (isProd) {
   };
 }
 
-module.exports = async function() {
-  const onBundle = async ({ store }) => {
-    await postBuild(buildOptions.staticFolder, store);
-  };
-  const run = process.env.NODE_ENV === 'development' ? watch : compile;
-  await run(buildOptions, onBundle);
-  return config;
-};
+module.exports = withComponentControls({
+  config,
+  development: !isProd,
+  options: { distFolder: resolve(__dirname, outFolder) },
+});

integrations/react-router-integration/package.json

@@ -13,8 +13,8 @@
     "dist/",
     "package.json",
     "README.md",
-    "post-build.js",
-    "post-build.d.ts"
+    "webpack-build.js",
+    "webpack-build.d.ts"
   ],
   "scripts": {
     "build": "yarn cross-env NODE_ENV=production rollup -c",
@@ -37,6 +37,8 @@
   "license": "MIT",
   "dependencies": {
     "@component-controls/app": "^2.10.5",
+    "@component-controls/core": "^2.10.4",
+    "@component-controls/logger": "^2.10.4",
     "@component-controls/search-algolia": "^2.10.4",
     "@component-controls/search-fusejs": "^2.10.4",
     "@component-controls/pages": "^2.10.5",

integrations/react-router-integration/rollup.config.js

@@ -1,5 +1,5 @@
 import { config } from '../../rollup-config';
 
 export default config({
-  input: ['./src/index.tsx', './src/post-build.ts'],
+  input: ['./src/index.tsx', './src/webpack-build.ts'],
 });

integrations/react-router-integration/src/webpack-build.ts

@@ -0,0 +1,82 @@
+import path from 'path';
+import fs from 'fs';
+import {
+  BuildProps,
+  Store,
+  defaultCompileProps,
+} from '@component-controls/core';
+import { getSiteMap } from '@component-controls/routes';
+import { LoadingStore, loadStore } from '@component-controls/store';
+import { log } from '@component-controls/logger';
+import {
+  CompilerCallbackFn,
+  searchIndexing,
+} from '@component-controls/webpack-compile';
+import { getBundleName } from '@component-controls/core/node-utils';
+import { compile, watch } from '@component-controls/webpack-compile';
+
+export const postBuild = async (
+  staticFolder: string,
+  loadingStore?: LoadingStore,
+): Promise<void> => {
+  if (loadingStore) {
+    const store: Store = loadStore(loadingStore, true);
+    if (process.env.NODE_ENV === 'production') {
+      if (store.config.siteMap) {
+        const sitemap = getSiteMap(store);
+        const sitemapfolder = path.resolve(staticFolder, '..');
+        if (!fs.existsSync(sitemapfolder)) {
+          fs.mkdirSync(sitemapfolder, { recursive: true });
+        }
+        const sitemapname = path.join(sitemapfolder, 'sitemap.xml');
+        log('creating sitemap', sitemapname);
+        fs.writeFileSync(sitemapname, sitemap, 'utf8');
+      }
+      await searchIndexing(store);
+    }
+  }
+};
+
+export const withComponentControls = ({
+  config,
+  development,
+  options,
+}: {
+  config: any;
+  development?: boolean;
+  options?: BuildProps;
+}) =>
+  async function(): Promise<any> {
+    const distFolder = path.join(process.cwd(), 'dist');
+    const buildOptions: BuildProps = {
+      ...defaultCompileProps,
+      configPath: '.config',
+      distFolder,
+      staticFolder: path.join(distFolder, 'static'),
+      ...options,
+    };
+    const onBundle: CompilerCallbackFn = async ({ store }) => {
+      await postBuild(buildOptions.staticFolder as string, store);
+    };
+
+    const run = development ? watch : compile;
+    await run(buildOptions, onBundle);
+    return {
+      ...config,
+      module: {
+        ...config.module,
+        rules: [
+          ...(config.module?.rules || []),
+          {
+            test: require.resolve('@component-controls/store/controls-store'),
+            use: {
+              loader: require.resolve('@component-controls/store/loader.js'),
+              options: {
+                bundleFileName: getBundleName(buildOptions),
+              },
+            },
+          },
+        ],
+      },
+    };
+  };

integrations/react-router-integration/webpack-build.d.ts

@@ -0,0 +1 @@
+export * from './dist/webpack-build';

integrations/react-router-integration/webpack-build.js

@@ -0,0 +1 @@
+module.exports = require('./dist/webpack-build');