styled-components - 样式组件扩展样式与共享样式不起作用
问题描述
我正在尝试使用 styled-components 扩展样式,但在仅部署中添加属性后无法正常工作。在开发中,这是完美的工作。
Chrome 和 Safari 的部署都没有改变。即使在开发人员工具中也找不到这些属性。硬刷新是没用的。
请告诉我我错过了什么。
// Logos.ts
const CommonStyle = css`
width: 100px;
min-width: 50px;
height: 100px;
min-height: 50px;
radius-border: 7px;
border: solid 1px #yellow;
`;
const DefaultLogo = styled(CommonSvg.DefaultIcon)`
${CommonStyle};
`;
const ProfileLogo = styled.img`
${CommonStyle};
object-fit: contain; // Added here. disappear...
`;
// Profile.tsx
const Wrapper = styled.div`
width: 200px;
height: 200px;
border-radius: 7px;
background-color: #FFF; // Added here. disappear too...
`;
const Profile = () => {
(...omission)
return (
<Wrapper>
{
imgUrl
? <ProfileLogo src={imgUrl} alt="profile" />
: <DefaultLogo />
}
<Wrapper>
)
};
解决方案
推荐阅读
- javascript - 页面转换时清除 redux 状态
- javascript - 滚动侦听器中风dashoffset在像素范围之间绘制SVG?
- elasticsearch - 大写字母在弹性搜索中应该排在第一位
- python - 每次我运行我的代码时,只有几个按钮被点击,然后我被一个 Element Click Intercepted Exception - Selenium Python 击中
- python - 我在尝试制作简单的纸牌游戏时遇到了问题
- three.js - GLTF 和分层 - 层上移动的对象被剪切/隐藏
- javascript - Select2 字段 .value 属性不会在 .onchange 函数内更改
- stripe-payments - 条带发送量自动除以100
- python - 如何加快熊猫系列中的排名功能?
- c++ - 具有依赖类型的 CRTP,类型名称查找