{"action":"created","issue":{"url":"https://api.github.com/repos/facebook/create-react-app/issues/5113","repository_url":"https://api.github.com/repos/facebook/create-react-app","labels_url":"https://api.github.com/repos/facebook/create-react-app/issues/5113/labels{/name}","comments_url":"https://api.github.com/repos/facebook/create-react-app/issues/5113/comments","events_url":"https://api.github.com/repos/facebook/create-react-app/issues/5113/events","html_url":"https://github.com/facebook/create-react-app/issues/5113","id":364249492,"node_id":"MDU6SXNzdWUzNjQyNDk0OTI=","number":5113,"title":"How to use babel-plugin-react-css-modules without ejecting?","user":{"login":"davidalejandroaguilar","id":15317732,"node_id":"MDQ6VXNlcjE1MzE3NzMy","avatar_url":"https://avatars0.githubusercontent.com/u/15317732?v=4","gravatar_id":"","url":"https://api.github.com/users/davidalejandroaguilar","html_url":"https://github.com/davidalejandroaguilar","followers_url":"https://api.github.com/users/davidalejandroaguilar/followers","following_url":"https://api.github.com/users/davidalejandroaguilar/following{/other_user}","gists_url":"https://api.github.com/users/davidalejandroaguilar/gists{/gist_id}","starred_url":"https://api.github.com/users/davidalejandroaguilar/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/davidalejandroaguilar/subscriptions","organizations_url":"https://api.github.com/users/davidalejandroaguilar/orgs","repos_url":"https://api.github.com/users/davidalejandroaguilar/repos","events_url":"https://api.github.com/users/davidalejandroaguilar/events{/privacy}","received_events_url":"https://api.github.com/users/davidalejandroaguilar/received_events","type":"User","site_admin":false},"labels":[{"id":554733913,"node_id":"MDU6TGFiZWw1NTQ3MzM5MTM=","url":"https://api.github.com/repos/facebook/create-react-app/labels/issue:%20question","name":"issue: question","color":"006b75","default":false}],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":3,"created_at":"2018-09-26T23:24:35Z","updated_at":"2018-10-19T14:11:26Z","closed_at":"2018-09-27T16:39:08Z","author_association":"NONE","body":"TL;DR; Asking for pointers on using `babel-plugin-react-css-modules` without ejecting.\r\n\r\nHi fellow `create-react-app` users,\r\n\r\nI'm a new user to this amazing tool, having only used React on Rails projects using Webpacker (I'm mostly a Ruby developer myself). I've been following courses on several resources and I got caught up on the whole styling React thing; so far choosing CSS modules as my favorite approach.\r\n\r\nPreviously, I configured CSS modules by ejecting, but now that `create-react-app` 2 is on the way I see CSS modules are coming with just an extension change. Great!\r\n\r\nHowever, I also saw that `babel-plugin-react-css-modules` is being favored over `react-css-modules`, in order to be able to use `styleName` and gaining all the performance benefits.\r\n\r\nSo I read about having to use Babel Macros to use this without ejecting. But if I don't know how to create a plugin/macro, do I need to stick with importing styles as an object and using className?\r\n\r\nSources I've read: [1](https://github.com/facebook/create-react-app/issues/167), [2](https://github.com/gajus/babel-plugin-react-css-modules/issues/108), [3](https://github.com/facebook/create-react-app/issues/2611), [4](https://github.com/facebook/create-react-app/issues/3815), [5](https://github.com/facebook/create-react-app/issues/2611), [6](https://github.com/facebook/create-react-app/issues/5103)"},"comment":{"url":"https://api.github.com/repos/facebook/create-react-app/issues/comments/431376615","html_url":"https://github.com/facebook/create-react-app/issues/5113#issuecomment-431376615","issue_url":"https://api.github.com/repos/facebook/create-react-app/issues/5113","id":431376615,"node_id":"MDEyOklzc3VlQ29tbWVudDQzMTM3NjYxNQ==","user":{"login":"patricklafrance","id":794579,"node_id":"MDQ6VXNlcjc5NDU3OQ==","avatar_url":"https://avatars1.githubusercontent.com/u/794579?v=4","gravatar_id":"","url":"https://api.github.com/users/patricklafrance","html_url":"https://github.com/patricklafrance","followers_url":"https://api.github.com/users/patricklafrance/followers","following_url":"https://api.github.com/users/patricklafrance/following{/other_user}","gists_url":"https://api.github.com/users/patricklafrance/gists{/gist_id}","starred_url":"https://api.github.com/users/patricklafrance/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/patricklafrance/subscriptions","organizations_url":"https://api.github.com/users/patricklafrance/orgs","repos_url":"https://api.github.com/users/patricklafrance/repos","events_url":"https://api.github.com/users/patricklafrance/events{/privacy}","received_events_url":"https://api.github.com/users/patricklafrance/received_events","type":"User","site_admin":false},"created_at":"2018-10-19T14:11:26Z","updated_at":"2018-10-19T14:11:26Z","author_association":"NONE","body":"It's pretty easy to do with craco, here's a recipe to do it:\r\n\r\nhttps://github.com/sharegate/craco/tree/master/recipes/use-babel-plugin-react-css-modules\r\n\r\nIf you want to learn more, you can find the documentation here: https://github.com/sharegate/craco/tree/master/packages/craco"}}
{"actor":{"display_login":"patricklafrance"}}