問題描述寫了2個相互無關的組件,但是2個組件都使用了animate寫動畫,然后上傳到私庫的時候用webpack打包了,有個項目要引用這2個組件,結果發現其中一個組件的動畫無效了,經過查找確定是因為經過webpack打包,動畫效果的名稱都變成相同了,然后相互有影響了問題出現的環境背景及自己嘗試過哪些方法相關代碼// 請把代碼文本粘貼到下方(請勿用圖片代替代碼)組件A css@keyframes a {
0% { background-color: #fff;
}
50% { background-color: #000;
} to { background-color: #fff;
}
}組件B@keyframes a {
0% { stroke-dasharray: 1, 200; stroke-dashoffset: 0
}
50% { stroke-dasharray: 90, 150; stroke-dashoffset: -40
} to { stroke-dasharray: 90, 150; stroke-dashoffset: -120
}
}你期待的結果是什么?實際看到的錯誤信息又是什么?組件之間動畫的css相互不影響,本來想不打包上傳組件,但是如果不打包資源可能會比較大,所以放棄了那種想法。
組件的動畫效果相互影響
小唯快跑啊
2018-10-24 10:39:40