danawoodman / react-fontawesome

A React Font Awesome component.
https://www.npmjs.com/package/react-fontawesome
MIT License
667 stars 72 forks source link

1.4.0 breaks everything in our Material-UI project #32

Closed bushmango closed 7 years ago

bushmango commented 7 years ago

More details if we figure anything else out -- just verified that updating this package is what breaks our project:

Update "react-fontawesome" in package.json from 1.3.1 to 1.4.0? Yes

danawoodman commented 7 years ago

@bushmango hmm that is weird. Please let me know what errors you are seeing so I can help

bushmango commented 7 years ago

The error I get is:

Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. Check the render method of AppTitleBar.

bushmango commented 7 years ago

It happens in any component with [FontAwesome /] in it

bushmango commented 7 years ago

Here's our (non-private) dependencies. Notice react 15.3.2 "dependencies": { "babel-core": "^6.18.2", "babel-loader": "^6.2.7", "babel-polyfill": "^6.16.0", "babel-preset-es2015": "^6.18.0", "bind-decorator": "^1.0.10", "chalk": "^1.1.3", "copyfiles": "^1.0.0", "figlet": "^1.2.0", "freezer-js": "^0.11.2", "lockr": "^0.8.4", "lodash": "^4.17.2", "material-ui": "0.16.2", "moment": "^2.16.0", "numeral": "^1.5.3", "react": "15.3.2", "react-dom": "15.3.2", "react-fontawesome": "1.4.0", "react-hot-loader": "^3.0.0-beta.6", "react-motion": "^0.4.5", "react-router": "^3.0.0", "react-tap-event-plugin": "^1.0.0", "superagent": "^2.3.0", "tslint": "^3.15.1", "tslint-react": "^1.1.0", "typescript": "^2.1.1", "webpack": "^2.1.0-beta.25", "xml2js": "^0.4.17" }, "devDependencies": { "source-map-loader": "^0.1.5", "ts-loader": "^1.2.1" }

KagamiChan commented 7 years ago

It seems that the reason is 09f7c01d70eeed1b9d9796a97dcd364abf503dd0 adds another export, which prevents babel-plugin-add-module-exports from working in compilation, as the module takes effect if only the export default declaration exists

danawoodman commented 7 years ago

@KagamiChan interesting, thanks for observation. Any thoughts on a workaround?

@bushmango for now I would downgrade reat-fontawesome until we fix this

KagamiChan commented 7 years ago

If I understand correctly that PR, the exported srOnlyStyle is for test purpose, so maybe we can create a file for this piece of code and require it both in index.js and test.js. This won't add extra labor for maintaining srOnlyStyle, but might leave some difficulty for those who want to customize the style or want to make some more tests

btw. using import statement won't be influenced by this PR, only require will. (preset es2015-node6)

danawoodman commented 7 years ago

Makes sense, I will try and push up a fix unless you beat me to it @KagamiChan 😄

KagamiChan commented 7 years ago

I would like to help given some time. But I feel this issue somewhat urgent because there's risks that it dose not expose until codes get compiled and shipped to users, which did happen for a project of my team.

danawoodman commented 7 years ago

I'll try to get to it today

vsaarinen commented 7 years ago

This also caused our product to break, and required quite a bit of detective work to narrow down the cause. Downgrading to 1.3.1 fixed the problem.

danawoodman commented 7 years ago

Sorry for delay, finally got a a chance to fix this. New release is v1.5.0. Can someone try it out and report back? @vsaarinen @KagamiChan @bushmango

getreup commented 7 years ago

I had the same problem and this version fixed it for me.

danawoodman commented 7 years ago

Thanks for the confirmation @getreup!