kitze / custom-react-scripts

[DEPRECATED, use customize-cra] Allow custom config for create-react-app without ejecting
https://custom-react-scripts.netlify.com
MIT License
994 stars 97 forks source link

Support CSSModules for SASS. #21

Closed stereobooster closed 7 years ago

stereobooster commented 7 years ago

I need this feature to have out of the box integration with react-toolbox. See https://github.com/react-toolbox/react-toolbox-example/pull/35

The question is if we have:

REACT_APP_SASS=true
REACT_APP_CSS_MODULES=true

Does it always mean we want CSSModules for SASS? I suppose yes

claylevering commented 7 years ago

+1 to this, I just ran into this and was thinking about possibly contributing code but I'm not the world's best CSS Modules expert... perhaps I'll look at it tonight.

stereobooster commented 7 years ago

Solution is simple, question is how to integrate it

  'SASS': {
    toArray: 'loaders',
    getDev: function () {
      return {
        test: /(\.scss|\.sass)$/,
        loader: "style!css?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss"
      }
    },
    getProd: function () {
      return {
        test: /(\.scss|\.sass)$/,
        loader: ExtractTextPlugin.extract('style', 'css?modules&-autoprefixer&importLoaders=1!postcss')
      }
    }
  },
claylevering commented 7 years ago

@stereobooster - Does that seem to work?

stereobooster commented 7 years ago

Created PR so closing issue. https://github.com/kitze/create-react-app/pull/23