阻止 cssnano v4 向命名网格区域添加引号

Question

cssnano v4 将命名的网格区域转换为带引号的字符串，而不是 custom-identifiers，例如：

/* input */
header {
  grid-area: header;  
}

/* output */
header {
  grid-area: "a";  
}

将值设为字符串会破坏 css 网格功能。

Answer 1

将reduceIdents的gridTemplate设置为false：

// postcss.config.js

module.exports = {
  plugins: [
    require('postcss-import')(),
    require('postcss-url')(),
    require('cssnano')({
      preset: [
        'advanced',
        {
          discardComments: {
            removeAllButFirst: true,
          },
          reduceIdents: {
            gridTemplate: false,
          },
          autoprefixer: {},
        },
      ],
    }),
  ],
};