使用Tailwind rounded-md时premailer/cssutils报border-radius属性值无效

• 涉及的HTML代码：

<a href="/" class="rounded-md">Navigate</a>

• rounded-md是Tailwind的圆角工具类，对应的CSS值为0.375rem
• 执行premailer/cssutils的transform(html)方法时触发报错，错误信息如下：

Property: Invalid value for "CSS Backgrounds and Borders Module Level 3" property:
0.375rem [1:1: border-radius]

• 已知rem单位在浏览器中可正常生效，需解决该工具转换时的报错问题

• 替换rem为px单位：
  邮件客户端普遍对rem支持较差，premailer/cssutils可能因此对rem值做了严格限制。0.375rem等价于6px，可修改Tailwind配置将rounded-md的对应值改为px：

  // tailwind.config.js
  module.exports = {
    theme: {
      extend: {
        borderRadius: {
          'md': '6px',
        },
      },
    },
  }
  

  之后重新编译CSS即可。

• 手动添加内联样式：
  绕过premailer的自动转换流程，直接给元素写内联样式，避免工具对类名解析时的报错：

  <a href="/" style="border-radius: 6px;">Navigate</a>
  

• 关闭premailer的CSS验证：
  若不需要严格的CSS标准校验，可在初始化premailer时配置关闭验证相关选项，跳过对border-radius值的合法性检查。

内容的提问来源于stack exchange，提问作者dras