michalkvasnicak / babel-plugin-css-modules-transform

Extract css class names from required css module files, so we can render it on server.
MIT License
326 stars 54 forks source link

`keepImport` is incorrect when `extractCss` is used #83

Open danoc opened 6 years ago

danoc commented 6 years ago

Hello! I'm using preprocessCss and extractCss to convert a SCSS file to CSS then store it in my library's dist folder. I also use keepImport.

The import in the JS file points to the SCSS file. Unfortunately, it seems that there is no way to convert the generated require to point to the compiled CSS that extractCss copied to the dist.

Is this something worth adding to the plugin? If so, I might take a pass at it.

kentandersen commented 6 years ago

👍 I would love this feature to :)

CPatchane commented 5 years ago

Hello! I get into this issue so it could be great to have this handling automatically 👍 But, waiting that, I find a not documented option named importPathFormatter in the code which allows to custom the require path here. Here is the usage :

// importPathFormatter.js
module.exports = path => path.replace(/\.scss$/, '.css')
// .babelrc
...
    "plugins": [
       ["css-modules-transform", {
         ...
         "importPathFormatter": "./importPathFormatter",
         ...
        }
    ]
...

In

require('./mystyle.scss')

Out

require('./mystyle.css')

@michalkvasnicak Is this just a missing documentation or this option should not be used for a reason? I could make a PR if this is just about documentation. Hope this helps!