feat(postcss): support both object and array for plugin

Anidetrix · Jun 26, 2020 · 7ce53b9 · 7ce53b9
1 parent b1e4b9d
commit 7ce53b9
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 14 deletions.
diff --git a/src/loaders/postcss/config.ts b/src/loaders/postcss/config.ts
@@ -11,7 +11,7 @@ interface Options {
 }
 
 interface Config extends Options {
-  plugins?: { [p: string]: Record<string, unknown> };
+  plugins?: { [p: string]: Record<string, unknown> } | (string | postcss.Plugin<unknown>)[];
 }
 
 interface Result {
@@ -33,7 +33,7 @@ export default async function (
 
   if (!found || found.isEmpty) return { plugins: [], options: {} };
 
-  const { plugins: _plugins, parser, syntax, stringifier } =
+  const { plugins, parser, syntax, stringifier } =
     typeof found.config === "function"
       ? found.config({
           cwd: process.cwd(),
@@ -43,7 +43,6 @@ export default async function (
         })
       : found.config;
 
-  const plugins = _plugins && Object.entries(_plugins);
   const result: Result = { plugins: ensurePCSSPlugins(plugins), options: {} };
   if (parser) result.options.parser = ensurePCSSOption(parser, "parser");
   if (syntax) result.options.syntax = ensurePCSSOption(syntax, "syntax");

diff --git a/src/types.ts b/src/types.ts
@@ -110,15 +110,17 @@ export interface Options {
    * A list of plugins for PostCSS,
    * which are used before plugins loaded from PostCSS config file, if any
    */
-  plugins?: (
-    | postcss.Transformer
-    | postcss.Processor
-    | string
-    | [string | postcss.Plugin<unknown>]
-    | [string | postcss.Plugin<unknown>, Record<string, unknown>]
-    | null
-    | undefined
-  )[];
+  plugins?:
+    | Record<string, unknown>
+    | (
+        | postcss.Transformer
+        | postcss.Processor
+        | string
+        | [string | postcss.Plugin<unknown>]
+        | [string | postcss.Plugin<unknown>, Record<string, unknown>]
+        | null
+        | undefined
+      )[];
   /**
    * Select mode for this plugin:
    * - `"inject"` *(default)* - Embeds CSS inside JS and injects it into `<head>` at runtime.
@@ -134,8 +136,10 @@ export interface Options {
    */
   mode?:
     | "inject"
+    | ["inject"]
     | ["inject", InjectOptions | ((varname: string, id: string) => string)]
     | "extract"
+    | ["extract"]
     | ["extract", string]
     | "emit"
     | ["emit"];

diff --git a/src/utils/options.ts b/src/utils/options.ts
@@ -79,10 +79,11 @@ export function ensurePCSSPlugins(
   plugins: Options["plugins"],
 ): (postcss.Transformer | postcss.Processor)[] {
   if (typeof plugins === "undefined") return [];
-  else if (!Array.isArray(plugins)) throw new TypeError("`plugins` option must be an array!");
+  else if (typeof plugins !== "object")
+    throw new TypeError("`plugins` option must be an array or an object!");
 
   const ps: (postcss.Transformer | postcss.Processor)[] = [];
-  for (const p of plugins) {
+  for (const p of !Array.isArray(plugins) ? Object.entries(plugins) : plugins) {
     if (!p) continue;
 
     if (!Array.isArray(p)) {