Geek Answers Handbook

Using webpack to load CSS files from node modules

I am trying to use a component that contains a css file. I need a component as usual:

var Select = require('react-select');

I would like to know how I will need the css needed for the component.

I already tried this:

 require('react-select/dist/react-select.css');

And this:

 require('react-select.css');

And no one worked.

+6
source share
2 answers
 //package.json "dependencies": { "my-package": "2.0.0" } //app.js //Get a relative path to the installed css files: require('../someRelativePathFromAppJs/node_modules/my-package/somePath/myNeeded.css')
0
source

Make sure that your web package has the following:

 module: { loaders: [ { test: /\.css$/, loader: "style-loader!css-loader" } ] }

This will require and link any css file that you need, and I would pull them exactly how you did it:

 require('react-select/dist/react-select.css');

Another workaround that works for sure is that you copy this css file, and in html you link it by:

 <link rel="stylesheet" href="/path/to/react-select.css">
+11
source

More articles:


All Articles