Create-react-app: CSS build @keyframes minification (CRA - v2.0)

Created on 8 Aug 2018  路  3Comments  路  Source: facebook/create-react-app

Hey guys.
Hope you are doing fine.

I have found a bug with minified css.
create-react-app is minified css keyframes to some associative names like a, b etc. End this is bad because the new version creates two chunks main and vendor and both would have minified keyframes in each file and they would cross and conflict...

main chunk
vendor chunk

version to reproduce: 2.0.0-next.3e165448.

current stable version 1.1.4 works as expected.

p.s: sorry for my English

Most helpful comment

I have found your improvement - https://github.com/facebook/create-react-app/commit/52449c34eedc53e50a2a159d38604ea7df5bd997
and you are totally right, I have added this option { cssProcessorOptions: { safe: true } } to react-scripts/config/webpack.config.prod.js locally and it works as expected

All 3 comments

Do you have a repo? I can test it out in next branch. I've turned on safe-options in css-nano and hopefully this situation is handled as well.

I have found your improvement - https://github.com/facebook/create-react-app/commit/52449c34eedc53e50a2a159d38604ea7df5bd997
and you are totally right, I have added this option { cssProcessorOptions: { safe: true } } to react-scripts/config/webpack.config.prod.js locally and it works as expected

Thanks for testing it out. A new build of 2.0.0@next was published with this change.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

DaveLindberg picture DaveLindberg  路  3Comments

dualcnhq picture dualcnhq  路  3Comments

ap13p picture ap13p  路  3Comments

oltsa picture oltsa  路  3Comments

JimmyLv picture JimmyLv  路  3Comments