In the postcss / autoprefixer library options, the grid option should be specified only if Internet Explorer 10-11 is planned to be supported (then, appropriate vendor prefixes will be added to support the CSS Grid). By default, this will not be done, then if you explicitly specify 'ie11' in the list of browsers.
grid (false | "autoplace" | "no-autoplace"): should Autoprefixer add IE 10-11 prefixes for Grid Layout properties?
But what if we do not know in advance whether we will be writing code, will there be Internet Explorer support? In the code below (written in TypeScript), we need to evaluate isSomeVersionOfInternetExplorerSupported . We can check and analyze the supportedBrowsers array (its element can be any valid value of the browserslist property of the library of the same name, for example, last 1 version , not dead , etc.), but we don’t know in advance what elements the array will contain.
class BroserslistHelper { private supportedBrowsers: Array<string>; constructor(supportedBrowsers: Array<string>) { this.supportedBrowsers = supportedBrowsers; } get autoprefixerSetitngs: autoprefixer.Options { return { browsers: this.supportedBrowsers, grid: this.isSomeVersionOfInternetExplorerSupported ? 'autoplace' : false } } get isSomeVersionOfInternetExplorerSupported(): boolean { let someVersionOfInternetExplorerSupported = false; this.supportedBrowsers.forEach( (browser: string) => { // we need to compute is something ... }) return someVersionOfInternetExplorerSupported; } } If Internet Explorer is explicitly specified in the array (for example, ie ), then the solution will be simple, but what if the array only includes properties like >5% , cover 99.5% , not dead , etc.?
