Scopify with CSS modules and Webpack

[griable]

Hi,

First I apologise since it not directly a Scopify issue but more a CSS Module + Scopify usage question.

I would like to be able to use Scopify with CSS Modules and its composition system but I'm currently out of luck.

The problem is that composition only works with local filenames such as .root and using it with Scopify make it #app .root which leads to the following error :

Module build failed:
Error: composes is only allowed when selector is single :local class name not in ":local(#app) :local(.root)"

My configuration is :

var webpackConfig = {
  context: jsSrc,
  plugins: [],
  resolve: {
    extensions: [''].concat(extensions),
    modulesDirectories: ['node_modules', 'components']
  },
  module: {
    loaders: [
      {
        test: /\.js$/,
        loader: 'babel-loader?stage=1',
        exclude: /node_modules/
      },
      {
        test: /\.css$/,
        loader: ExtractTextPlugin.extract('style-loader', 'css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss-loader')
      }
    ]
  },
  postcss: [
    require('autoprefixer'),
    require('postcss-nested'),
    require('postcss-scopify')('#app')
  ],
  plugins: [
    new ExtractTextPlugin('style.css', { allChunks: true })
  ]
}

Finally, my question is, is there anyway to get the code prefixed by Scopify after it has been parsed by the CSS loader.

Thank you for helping!

[pazams]

@griable, tnx for reporting this issue. I understand the issue. The easiest way I would get around this would be to to use the cli version of scopify https://github.com/pazams/scopify-cli . this way scoping would be an extra command after webpack finishes compiling. If that works, then a small shell script combining webpack and scopify-cli commands would be convenient.

I'm leaving this issue open. Maybe there's a better way to do it (I myself do not use webpack).

[griable]

Hi pazams,

Thank you very much for this answer. Ok, I'll proceed using with a bashfile for now.

I'll try later to find a way to prioritize the precss tasks but I'm afraid it seems to be against its philosophy.