鍍金池/ 問答/HTML5  HTML/ 項(xiàng)目啟用了css_modules,寫keyframes無效不知道為什么?

項(xiàng)目啟用了css_modules,寫keyframes無效不知道為什么?

dva生成的項(xiàng)目里面用less寫樣式,想著寫一個(gè)動畫,但是卻不起作用。代碼如下

.box{
  width: 100px;
  height: 100px;
  background-color: red;
  transform: translateX(100px);
}
:global{
  .over{
    animation:mymove 5s infinite;
  }
  @keyframes mymove {
    from { transform: translateX(0px) }
    to { transform: translateX(200px) }
  }
}
dom是這樣的
<div className={cx(l.box, 'over')}> </div>

按理說應(yīng)該初始化就會有動畫,可是為什么沒有作用?不知道錯在哪里??

回答
編輯回答
久舊酒

樓主你的問題解決了嗎?我也碰到這種問題了,
我測試了一下, 即使把 @keyframes 寫在 :global里面,CSS MODULE還是會改他的名字,所以沒法生效,我現(xiàn)在臨時(shí)把keyframes寫在head的style里了, 不知道有沒有辦法讓css module不處理keyframes的命名

2017年9月24日 13:59
編輯回答
孤慣

瀏覽器了看看生成的dom上的動畫名稱是啥,搜索一下css里有沒有這個(gè)動畫名稱,看是不是用了postcss的cssnano插件

2017年2月23日 12:40