Cannot resolve module 'style' when using react-flexgrid

[kjetilge]

I can't get react-flexgrid to work alongside storybook.
When I add this line:
import "react-flexgrid/lib/flexgrid.css"
to my componen.jsx I get the error:

ERROR in ./client/modules/cars/components/new_car.jsx
Module not found: Error: Cannot resolve module 'style' in /Users/kjetilge/Documents/Development/Tapcar-react/mantraMui2/client/modules/cars/components
 @ ./client/modules/cars/components/new_car.jsx 39:0-42

My ./storybook/webpack.config.js looks like this:

const path = require('path');
module.exports = {
  module: {
    loaders: [
      {
        test: /\.css?$/,
        loaders: [ 'style', 'raw' ],
        include: path.resolve(__dirname, '../')
      }
    ]
  },
  resolve: {
     extensions: ['', '.js', '.jsx'],
  },
};

[track0x1]

Did you install style-loader in your npm package?

[kjetilge]

I did, but it gave me new problems/warnings. Don't remember exactly. Switched to reflexbox now, though I think some things are missing in that package..

[track0x1]

Also I'd remove include: ... from your loader because the css file is going to be in node_modules which isn't included by your config.

ps. a better regex might be test: /\.css$/ so you don't capture .c or .cs

[kjetilge]

This webpack stuff is totally new to me. Need to read up on the syntax etc. I'll try it !

[arunoda]

Our latest storybook has much support for CSS and read our docs here: https://getstorybook.io