webpack support

[jpeer264]

webpack support

[denis-gorin]

first of all may be this is not a right way, because I run module after webpack build
but it suites for me, well, just follow this instructions
https://www.npmjs.com/package/on-build-webpack2
in combination with sync usage of rcs module
the result in my webpack config:

const WebpackOnBuildPlugin = require('on-build-webpack2');
const rcs = require('rename-css-selectors');

// ...

    plugins: [
      // ...
      new WebpackOnBuildPlugin(function(stats) {
        // Do whatever you want... Exactly:
        rcs.loadMapping('./renaming_map.json');
        let options = {
          overwrite: true,
          newPath: path.resolve(__dirname)
        }
        try {
          rcs.process.autoSync(['./public/**/*.js', './public/**/*.html', './public/**/*.css'], options);
          rcs.generateMappingSync('./', { overwrite: true });
        } catch (err) {
          console.error(err);
        }
      }),
      // ...
    ]

// ...

PS
there is only one problem with tilda:

.someSelector~.anotherSelector {
  // ... some css_rules
}

PPS

Quick workaround for this is to use predefined rule in renaming_map.json

".someSelector": "xx",
".someSelector~": "xx ~",

[JPeer264]

Hey @fzp01717, thanks for your issue. I am not very experienced in neither laravel-mix nor webpack. Maybe @klimashkin does know a way using rcs with webpack.

[fzp01717]

hello @JPeer264 thanks for your quick response :) . I will wait for @klimashkin comment then.

Thank you

[denis-gorin]

@fzp01717,
I integrate this module thru on-build-webpack2 plugin

[fzp01717]

Thank you so much @denis-gorin. I will check it out. 😊

[JPeer264]

@denis-gorin thanks for this plugin. Can you tell me how this works? I can add it to the README with a small description on how to use this lib with webpack.