search

ryanswapp / react-phoenix-starter-template

This is an example repo of using React with Phoenix
99 stars 6 forks source link

Example of load static CSS from node_modules. #8

Closed bartekupartek closed 8 years ago

bartekupartek commented 8 years ago

I've based on your great starter my new project and now I don't know how to load with webpack any CSS from node_modules libs, for example I installed leaflet and any attempt of load leaflet/dist/leaflet.css fails. Could you provide example how to load static styles from node_modules?

bartekupartek commented 8 years ago

ok, I found solution you can look: stackoverflow, maybe you have some suggestions.

ryanswapp commented 8 years ago

Sorry for the late reply. I've had finals at school the last two weeks that have kept me pretty busy.

I believe you should have two options:

1) Import the styles from the node module into index.css and the styles will be global. You'll just have to use the absolute path to the styles to import them.

2) Import the styles into the specific component you want to use them in. Check out this component for an example of how to do it. https://github.com/ryanswapp/react-phoenix-starter-template/blob/master/frontend/app/screens/App/screens/Public/Home/index.js

You'll notice that styles imported from './style' are used throughout the component with the 'styleName' attribute that CSSModules gives us. If you import the styles directly into the component you can then use them with CSSModules and they will be specific to that component (i.e. not global).