reactjs - 供应商前缀在 Radium 中粘合在一起

Question

我正在使用 Radium 在一个简单的 React 应用程序中内联我的样式，但不知怎的，Radium 一个接一个地编译供应商前缀：

import Radium from 'radium'
import React from 'react'

const styles = {
    base: {
        width: 'calc(100% - 4rem)',
        maxWidth: '60rem',
        margin: '0 auto'
    }
}

const Container = function (props) {
    return <div className='container' style={styles.base}>
        {props.children}
    </div>
}

export default Radium(Container)

这一切似乎都适用于不需要供应商前缀的属性（如 maxWidth 或 margin），但宽度被编译为：

width: -webkit-calc(100% - 4rem),-moz-calc(100% - 4rem),calc(100% - 4rem);

当然，浏览器会抱怨这是一个无效值。display: flex例如，与 相同。

任何想法？

Answer 1

已修复，我错过了一条信息：这是在服务器中旧渲染的。在镭配置中添加适当的用户代理解决了它（https://github.com/FormidableLabs/radium/tree/master/docs/api#configuseragent）。