fix(build): process templates & customers entrypoints separately

trafilea · Dec 9, 2020 · bee8bbc · bee8bbc
1 parent 8e27b15
commit bee8bbc
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 43 deletions.
diff --git a/packages/nx-shopify/src/webpack/configs/shopify.config.ts b/packages/nx-shopify/src/webpack/configs/shopify.config.ts
@@ -1,41 +1,24 @@
 import * as CopyWebpackPlugin from 'copy-webpack-plugin';
 import * as glob from 'glob';
+import * as path from 'path';
 import { Configuration } from 'webpack';
 import * as webpackMerge from 'webpack-merge';
 import * as HTMLWebpackPlugin from 'html-webpack-plugin';
 import * as MiniCssExtractPlugin from 'mini-css-extract-plugin';
 import { BuildBuilderOptions } from '../../builders/build/schema';
-import { getTemplatesLiquidFiles } from '../utils/template-utils';
+import {
+  getTemplateEntryPoints,
+  getTemplatesLiquidFiles,
+} from '../utils/template-utils';
 import { getCommonWebpackPartialConfig } from './common.config';
 
 function getShopifyWebpackPartialConfig(options: BuildBuilderOptions) {
   const { sourceRoot, themekitConfig } = options;
 
-  const templatesEntries = glob
-    .sync(`${sourceRoot}/theme/templates/**/*.ts`)
-    .reduce((acc, path) => {
-      const entry = path.replace(/^.*[\\/]/, '').replace('.ts', '');
-      acc[entry] = path;
-      return acc;
-    }, {});
-
-  function generateHtmlPlugins(dir) {
-    const files = getTemplatesLiquidFiles(dir);
-    return files.map((item) => {
-      const parts = item.split('.');
-      const name = parts[0];
-      return new HTMLWebpackPlugin({
-        filename: `templates/${name}.liquid`,
-        template: `${dir}/${name}/${name}.liquid`,
-        inject: false,
-        templateBundle: `${name}`,
-        cache: false,
-      });
-    });
-  }
-
   const webpackConfig: Configuration = {
-    entry: templatesEntries,
+    entry: {
+      ...getTemplateEntryPoints(sourceRoot),
+    },
     output: {
       path: options.outputPath,
       // chunkFilename: './assets/[name].bundle.js',
@@ -83,7 +66,6 @@ function getShopifyWebpackPartialConfig(options: BuildBuilderOptions) {
       new MiniCssExtractPlugin({
         filename: 'assets/[name].css',
       }),
-      ...generateHtmlPlugins(`${sourceRoot}/theme/templates`),
     ],
   };
   return webpackConfig;

diff --git a/packages/nx-shopify/src/webpack/utils/template-utils.ts b/packages/nx-shopify/src/webpack/utils/template-utils.ts
@@ -1,21 +1,25 @@
-import * as fs from 'fs';
+import * as glob from 'glob';
+import * as path from 'path';
 
-export function getTemplatesLiquidFiles(dir) {
-  let results = [];
-  const list = fs.readdirSync(dir);
-  list.forEach(function (file) {
-    const fileName = file;
-    file = dir + '/' + file;
-    const stat = fs.statSync(file);
-    if (stat && stat.isDirectory()) {
-      results = results.concat(getTemplatesLiquidFiles(file));
-    } else {
-      const partOfName = fileName.split('.');
-      if (partOfName[1] == 'liquid') {
-        results.push(fileName);
-      }
-    }
+export function getTemplateEntryPoints(sourceRoot) {
+  const entrypoints = {};
+
+  const templatesEntries = glob.sync(`${sourceRoot}/theme/templates/**/*.ts`, {
+    ignore: `${sourceRoot}/theme/templates/customers/**`,
+  });
+
+  templatesEntries.forEach((filePath) => {
+    const entryName = path.parse(filePath).name;
+    entrypoints[`template.${entryName}`] = filePath;
+  });
+
+  const templatesCustomersEntries = glob.sync(
+    `${sourceRoot}/theme/templates/customers/**/*.ts`
+  );
+  templatesCustomersEntries.forEach((filePath) => {
+    const entryName = path.parse(filePath).name;
+    entrypoints[`template.customers.${entryName}`] = filePath;
   });
 
-  return results;
+  return entrypoints;
 }