Popular posts

Hey Prashant, was trying to do this as per the link you shared as well. May be I am missing something.

module: {
    loaders: [
      /*{
        test: /\.css$/,
        loader: 'style!css?modules',
      },*/
      {
        test: /\.scss$/,
        loader: ExtractTextPlugin.extract('style!css!sass')
      },
      {
        test: /\.jsx*$/,
        exclude: [/node_modules/, /.+\.config.js/],
        loader: 'babel',
        query: {
          presets: ['react-hmre'],
        },
      },
    ],
  },

  /*sassLoader: {
    includePaths: [path.resolve(__dirname, "./client/index.js")]
  },*/

  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new webpack.DefinePlugin({
      'process.env': {
        CLIENT: JSON.stringify(true)
      }
    }),
    new ExtractTextPlugin('app.css', {
            allChunks: true
    })
  ],

I get an error saying unexpected token, in the .scss file that I import in my container.

So I have a parent level app.css file, as in the original kit. I want to keep that but for the individual components/containers, I would like to have their own scss files. Can you guide how to do that?

It seems you are looking for css modules but you have commented out that css module loader, any reasons?

Hey Prashant, thanks for the reply. So keeping it hadn't worked either for me earlier too. Also, I had tried renaming the app.css to app.scss after commenting the test for \/.css$\,

below is the error

shared/components/ListItem/ListItem.scss: Unexpected token (1:19)
> 1 | tn-container {
    |              ^
  2 |     border-radius: 5px;

can't tell whats messed up. I must be doing something silly somewhere. Would appreciate help resolving this since thats the missing piece and we are using mern for our production stack.

Did you ever resolve this? I can't include CSS either. I'm trying to use Semantic UI CSS and I can't figure out how to get MERN to accept any fonts. Once the app crashes it never recovers even if I remove all references and I have to init a new project.