在react less文件中直接使用以下css属性失效

// 单行文字加省略号
 overflow: 'hidden',
 textOverflow: 'ellipsis',
 whiteSpace: 'nowrap'
 // 两行文字加定高
   overflow: 'hidden',
   textOverflow: 'ellipsis',
   display: '-webkit-box',
   -webkit-line-clamp: 2,
   -webkit-box-orient: 'vertical'

解决办法

使用style加入行内样式

• 注意div不要给定高
• 去掉单行省略号时要添加的white-space: 'nowrap’属性
• 行内样式要大写，-webkit-line-clamp写成WebkitLineClamp

// 单行样式
<p
   className={styles.courseText}
   style={{
   		overflow: 'hidden',
   		textOverflow: 'ellipsis',
   		whiteSpace: 'nowrap'
   }}
>{文字}</p>

// 多行样式
<p
   className={styles.courseText}
   style={{
   		overflow: 'hidden',
   		textOverflow: 'ellipsis',
        display: '-webkit-box',
        WebkitLineClamp: 2,
        WebkitBoxOrient: 'vertical'
   }}
>{文字}</p>

然后就大功告成啦！