Expose JSON data to other PostCSS plugins?

[ben-eb]

It might be good to use Result#messages to store the JSON map of classes and generated class names. That way the data can be easily accessed by other plugins.

[ai]

I though about it too, but postcss-modules is used before concat, but cssnano works after concat :(. So it will works only if we concat files by postcss-import.

Anyway we should think about addition way. For example we use selectors rules to find isolation classes. Like we can use rule: 'bem' and then .logo__name and .menu__name will be isolated.

But I think we should give a two ways. Result#messages is useful too.

[ai]

@ben-eb also @Outpunk in on vacation right now (baby).So I think we should implement some logic in cssnano before postcss-modules fixes. I can help you with postcss-modules PR.

[ben-eb]

We already have the additional way, the existing getJSON function. I thought it might be nice to keep it all in a single PostCSS instance with, of course, the caveat that you have to use postcss-import. 😄

[michael-ciniawsky]

We need result.messages support for postcss-loader. @Outpunk could you point me to where the mappings (JSON) are generated ? 😛

[madyankin]

@michael-ciniawsky Actually, the plugin uses css-modules-loader-core's parser. So, we need to modify the parser to add the API.
https://github.com/css-modules/postcss-modules/blob/master/src/index.js#L82
https://github.com/css-modules/css-modules-loader-core/blob/master/src/parser.js

I'll be happy if you make a PR for this, because I have no time to make it.

[michael-ciniawsky]

I'll be happy if you make a PR for this, because I have no time to make it.

Yep, of course 😛

css-loader-core/lib/parser.js

  plugin( css, result ) {
    return Promise.all( this.fetchAllImports( css ) )
      .then( _ => this.linkImportedSymbols( css ) )
-     .then( _ => this.extractExports ( css ) )
+     .then( _ => {
+        this.extractExports( css ) 
+        result.messages.push({ type: 'modules', modules: this.exportTokens })
+     })
   }

?

[madyankin]

Looks awesome!

[carlhopf]

👍 Would be awesome to access the mappings through result.messages! :)