feat: Support plain string and object syntax for webpack entries.

Author: amiller-gh

packages/@css-blocks/webpack/src/Plugin.ts

@@ -1,5 +1,5 @@
 import { TemplateTypes } from "@opticss/template-api";
-import { ObjectDictionary } from "@opticss/util";
+import { ObjectDictionary, objectValues } from "@opticss/util";
 import * as debugGenerator from "debug";
 import { postcss } from "opticss";
 import * as path from "path";
@@ -64,6 +64,8 @@ export interface BlockCompilationComplete {
 
 type Assets = ObjectDictionary<Source>;
 
+type EntryTypes = string | string[] | ObjectDictionary<string>;
+
 interface CompilationResult {
   optimizationResult: OptimizationResult;
   blocks: Set<Block>;
@@ -100,8 +102,21 @@ export class CssBlocksPlugin
     this.trace(`starting analysis.`);
     this.analyzer.reset();
 
-    // Try to run our analysis.
-    let entries = compilation.options.entry as string[];
+    // Fetch our app's entry points.
+    let webpackEntry = compilation.options.entry as EntryTypes;
+    let entries: string[] = [];
+
+    // Zomg webpack, so many config format options.
+    if (typeof webpackEntry === "string") {
+      entries = [ webpackEntry ];
+    }
+    else if (Array.isArray(webpackEntry)) {
+      entries = webpackEntry;
+    }
+    else if (typeof webpackEntry === "object") {
+      entries = objectValues(webpackEntry);
+    }
+
     let pending: PendingResult = this.analyzer.analyze(...entries)
       // If analysis fails, drain our BlockFactory, add error to compilation error list and propagate.
       .catch((err: Error) => {

packages/@css-blocks/webpack/test/configs/basicConfig.ts

@@ -1,3 +1,5 @@
+import { ObjectDictionary } from "@opticss/util";
+
 import { Configuration as WebpackConfiguration } from "webpack";
 import * as merge from "webpack-merge";
 
@@ -9,7 +11,9 @@ import { BLOCK_LOADER_PATH } from "../util/testPaths";
 
 import { config as defaultOutputConfig } from "./defaultOutputConfig";
 
-export function config(entry: string, options?: LoaderOptions): WebpackConfiguration {
+export type EntryTypes = string | string[] | ObjectDictionary<string>;
+
+export function config(entry: EntryTypes, options?: LoaderOptions): WebpackConfiguration {
   const baseConfig: WebpackConfiguration = {
     entry: entry,
     output: {

packages/@css-blocks/webpack/test/util/execTest.ts

@@ -5,24 +5,33 @@ import * as webpack from "webpack";
 
 import { LoaderOptions } from "../../src/LoaderOptions";
 import { WebpackAny } from "../../src/Plugin";
-import { config as basicConfig } from "../configs/basicConfig";
+import { EntryTypes, config as basicConfig } from "../configs/basicConfig";
 
 import { BLOCK_FIXTURES_DIRECTORY, DIST_DIRECTORY } from "./testPaths";
 const CR = /\r/g;
 
 // This test harness was adapted from the sass-loader test suite.
 
-export function execTest(testId: string, options?: LoaderOptions) {
-    const entryPath = path.join(BLOCK_FIXTURES_DIRECTORY, testId + ".block.css");
-    return runWebpackAsPromise(basicConfig(entryPath, options))
-        .then(() => {
-            const actualCss = readBundle("bundle.block.css.js");
-            const expectedCss = readCss(testId);
+export function execTest(testId: string, options?: LoaderOptions, entryFormat: "string" | "object" | "array" = "string") {
+    const entryPath: string = path.join(BLOCK_FIXTURES_DIRECTORY, testId + ".block.css");
+    let entry: EntryTypes = entryPath;
 
-            // writing the actual css to output-dir for better debugging
-            // fs.writeFileSync(path.join(__dirname, "output", `${ testId }.${ ext }.css`), actualCss, "utf8");
-            assert.deepEqual(actualCss, expectedCss);
-        });
+    if (entryFormat === "array") {
+        entry = [entryPath];
+    }
+    else if (entryFormat === "object") {
+        entry = { main: entryPath };
+    }
+
+    return runWebpackAsPromise(basicConfig(entry, options))
+    .then(() => {
+        const actualCss = readBundle("bundle.block.css.js");
+        const expectedCss = readCss(testId);
+
+        // writing the actual css to output-dir for better debugging
+        // fs.writeFileSync(path.join(__dirname, "output", `${ testId }.${ ext }.css`), actualCss, "utf8");
+        assert.deepEqual(actualCss, expectedCss);
+    });
 }
 
 export function readCss(id: string): string {