Support array of plugins declared as strings.

[aero31aero]

Details

This postcss config works with webpack but postcss-load-config gives an error:

// postcss.config.js
module.exports = ({file}) => ({
    plugins: [
        // Warning: order is significant
        "postcss-nested",
        "postcss-extend-rule",
        [
            "postcss-simple-vars",
            {
                test_option: 'some value'
            },
        ],
        "postcss-calc",
        "postcss-media-minmax",
        "autoprefixer",
    ],
});

Am I doing something fundamentally incorrect or is this not supported?

Error:

Error (Logs|Stacks)

TypeError: Invalid PostCSS Plugin found at: plugins[0]

(@/srv/zulip/postcss.config.js)
    at /srv/zulip-npm-cache/f2739c284982d35277414af484c763f882870575/node_modules/postcss-load-config/src/plugins.js:77:15
    at Array.forEach (<anonymous>)
    at plugins (/srv/zulip-npm-cache/f2739c284982d35277414af484c763f882870575/node_modules/postcss-load-config/src/plugins.js:58:13)
    at processResult (/srv/zulip-npm-cache/f2739c284982d35277414af484c763f882870575/node_modules/postcss-load-config/src/index.js:37:14)
    at /srv/zulip-npm-cache/f2739c284982d35277414af484c763f882870575/node_modules/postcss-load-config/src/index.js:172:10
    at Function.sync (/srv/zulip-npm-cache/f2739c284982d35277414af484c763f882870575/node_modules/postcss-load-config/src/index.js:99:12)
    at assert_conversion (/srv/frontend_tests/node_tests/postcss.js:17:42)
... <further traceback is our calling code>

Reproduction (Code)

// test.js
const postcss = require("postcss");
const postcssrc = require('postcss-load-config');
const ctx = { parser: true, map: false, file: "/path/index.css"};
const {plugins, options} = postcssrc.sync(ctx);

Run node test.js.

Environment

OS	node	npm/yarn	package
Ubuntu 20.04	v14.17.3	6.14.13	1.22.10

[ai]

Why you can’t use require()?

[aero31aero]

I can, sure. I was just looking to add some tests to the codebase however and thought "hey, if its one of the supported methods to specify plugins, maybe it should also work with postcss-load-config so I should let them know".

I'd understand if you're not interested in supporting strings as plugins altogether and recommend just using require() but from the look of it, it should be a matter of if (typeof plugin === 'string') plugin = require(plugin); just before that block that checks whether the plugin is valid or not.

[ai]

We can do it, but you need to send PR and add tests