add plugin support

Author: skovy

package.json

@@ -47,6 +47,7 @@
     "dripip": "^0.10.0",
     "execa": "^5.1.1",
     "husky": "^7.0.4",
+    "postcss-calc": "^8.2.3",
     "postcss-scss": "^4.0.3",
     "rimraf": "^3.0.2",
     "tsdx": "^0.14.1",

recipes/compile-calc-plugin/input/a.css

@@ -0,0 +1,7 @@
+/* prettier-ignore */
+h1 {
+  font-size: calc(16px * 2);
+  height: calc(100px - 2em);
+  width: calc(2 * var(--base-width));
+  margin-bottom: calc(16px * 1.5);
+}

recipes/compile-calc-plugin/output/a.css

@@ -0,0 +1,7 @@
+/* prettier-ignore */
+h1 {
+  font-size: 32px;
+  height: calc(100px - 2em);
+  width: calc(var(--base-width)*2);
+  margin-bottom: 24px;
+}

recipes/compile-calc-plugin/transform.ts

@@ -0,0 +1,9 @@
+import { Transform } from '../../src';
+import calc from 'postcss-calc';
+
+export const transform: Transform = (fileInfo, api) => {
+  const root = api.parse(fileInfo.source);
+  return root.toString();
+};
+
+export const plugins = [calc({})];

src/api.ts

@@ -1,4 +1,5 @@
-import postcss, { Root, Parser } from 'postcss';
+import postcss, { Root, Parser, AcceptedPlugin } from 'postcss';
+
 export interface TransformAPI {
   /**
    * Parse a raw CSS string into an abstract syntax tree and return a PostCSS `Root` node.
@@ -8,11 +9,13 @@ export interface TransformAPI {
 
 const createAPIParse = ({
   parser,
+  plugins = [],
 }: {
   parser?: Parser;
+  plugins?: AcceptedPlugin[];
 }): TransformAPI['parse'] => {
   const parse: TransformAPI['parse'] = source => {
-    const result = postcss().process(source, {
+    const result = postcss(plugins).process(source, {
       // Silence warning about sourcemaps. Not relevant to this use case.
       from: undefined,
       parser,
@@ -40,9 +43,10 @@ const createAPIParse = ({
 
 export const createAPI = ({
   parser,
-}: { parser?: Parser } = {}): TransformAPI => {
+  plugins,
+}: { parser?: Parser; plugins?: AcceptedPlugin[] } = {}): TransformAPI => {
   const api: TransformAPI = {
-    parse: createAPIParse({ parser }),
+    parse: createAPIParse({ parser, plugins }),
   };
 
   return api;

src/perform.ts

@@ -18,9 +18,9 @@ interface ProcessTransformOptions {
  * Perform a transformation across a set of files.
  */
 export const perform = async (options: ProcessTransformOptions) => {
-  const { transform, parser } = await loadTransform(options.transform);
+  const { transform, parser, plugins } = await loadTransform(options.transform);
   const files = getAllFilesToTransform(options.files);
-  const api = createAPI({ parser });
+  const api = createAPI({ parser, plugins });
 
   files.map(file => {
     const fileInfo = getFileInfo(file);

src/transform.ts

@@ -1,5 +1,5 @@
 import { bundleRequire } from 'bundle-require';
-import { Parser } from 'postcss';
+import { AcceptedPlugin, Parser } from 'postcss';
 import { TransformAPI } from './api';
 import { TransformFileInfo } from './files';
 
@@ -38,6 +38,7 @@ export const validateTransform = (transform: unknown): Transform => {
 interface LoadTransformResult {
   transform: Transform;
   parser?: Parser;
+  plugins?: AcceptedPlugin[];
 }
 
 /**
@@ -48,9 +49,11 @@ export const loadTransform = async (
 ): Promise<LoadTransformResult> => {
   try {
     const { mod } = await bundleRequire({ filepath });
+
     const transform = validateTransform(mod.transform || mod.default);
     const parser = mod.parser;
-    return { transform, parser };
+    const plugins = mod.plugins;
+    return { transform, parser, plugins };
   } catch (err) {
     console.error(
       `An error occurred loading the transform file. Verify "${filepath}" exists.`

test/cli.test.ts

@@ -67,7 +67,7 @@ describe('cli', () => {
   });
 
   afterAll(() => {
-    fs.removeSync(cache);
+    // fs.removeSync(cache);
   });
 
   it.each(recipes)('should perform %s transform correctly', recipe => {

yarn.lock

@@ -2429,6 +2429,11 @@ cross-spawn@^7.0.0, cross-spawn@^7.0.3:
     shebang-command "^2.0.0"
     which "^2.0.1"
 
+cssesc@^3.0.0:
+  version "3.0.0"
+  resolved "https://registry.yarnpkg.com/cssesc/-/cssesc-3.0.0.tgz#37741919903b868565e1c09ea747445cd18983ee"
+  integrity sha512-/Tb/JcjK111nNScGob5MNtsntNM1aCNUDipB/TkwZFhyDrrE47SOx/18wF2bbjgc3ZzCSKW1T5nt5EbFoAz/Vg==
+
 cssom@^0.4.4:
   version "0.4.4"
   resolved "https://registry.yarnpkg.com/cssom/-/cssom-0.4.4.tgz#5a66cf93d2d0b661d80bf6a44fb65f5c2e4e0a10"
@@ -5116,6 +5121,14 @@ pkg-dir@^4.1.0, pkg-dir@^4.2.0:
   dependencies:
     find-up "^4.0.0"
 
+postcss-calc@^8.2.3:
+  version "8.2.3"
+  resolved "https://registry.yarnpkg.com/postcss-calc/-/postcss-calc-8.2.3.tgz#53b95ce93de19213c2a5fdd71277a81690ef41d0"
+  integrity sha512-EGM2EBBWqP57N0E7N7WOLT116PJ39dwHVU01WO4XPPQLJfkL2xVgkMZ+TZvCfapj/uJH07UEfKHQNPHzSw/14Q==
+  dependencies:
+    postcss-selector-parser "^6.0.2"
+    postcss-value-parser "^4.0.2"
+
 postcss-load-config@^3.0.1:
   version "3.1.1"
   resolved "https://registry.yarnpkg.com/postcss-load-config/-/postcss-load-config-3.1.1.tgz#2f53a17f2f543d9e63864460af42efdac0d41f87"
@@ -5129,6 +5142,19 @@ postcss-scss@^4.0.3:
   resolved "https://registry.yarnpkg.com/postcss-scss/-/postcss-scss-4.0.3.tgz#36c23c19a804274e722e83a54d20b838ab4767ac"
   integrity sha512-j4KxzWovfdHsyxwl1BxkUal/O4uirvHgdzMKS1aWJBAV0qh2qj5qAZqpeBfVUYGWv+4iK9Az7SPyZ4fyNju1uA==
 
+postcss-selector-parser@^6.0.2:
+  version "6.0.9"
+  resolved "https://registry.yarnpkg.com/postcss-selector-parser/-/postcss-selector-parser-6.0.9.tgz#ee71c3b9ff63d9cd130838876c13a2ec1a992b2f"
+  integrity sha512-UO3SgnZOVTwu4kyLR22UQ1xZh086RyNZppb7lLAKBFK8a32ttG5i87Y/P3+2bRSjZNyJ1B7hfFNo273tKe9YxQ==
+  dependencies:
+    cssesc "^3.0.0"
+    util-deprecate "^1.0.2"
+
+postcss-value-parser@^4.0.2:
+  version "4.2.0"
+  resolved "https://registry.yarnpkg.com/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz#723c09920836ba6d3e5af019f92bc0971c02e514"
+  integrity sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==
+
 postcss@^8.4.5:
   version "8.4.5"
   resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.5.tgz#bae665764dfd4c6fcc24dc0fdf7e7aa00cc77f95"
@@ -6314,7 +6340,7 @@ uri-js@^4.2.2:
   dependencies:
     punycode "^2.1.0"
 
-util-deprecate@^1.0.1:
+util-deprecate@^1.0.1, util-deprecate@^1.0.2:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
   integrity sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=