Hi :wave: how can I add obfuscation for js target ...

# multiplatform

[Piotr Bartkowiak]

Hi 👋 how can I add obfuscation for js target in KMP? I want my build/dist/ js-generated files to have obfuscated values for debug version. I tried creating webpack.config.js file in my build.gradle file:

js(IR) {
        moduleName = project.name
        browser {
            testTask { useKarma { useChromeHeadless() } }
            webpackTask {
                sourceMaps = false
                mainOutputFileName.set("${project.name}.js")
                output.library = project.name

                doLast {
                    writeWebpackConfig(
                        project = project,
                        buildDirectory = buildDirectory
                    )
                }
            }
        }
}

and:

private fun writeWebpackConfig(
    project: Project,
    buildDirectory: DirectoryProperty
) {
    val webpackConfigFile = File("$buildDirectory/webpack.config.js")
    val absoluteDistPath = buildDirectory.get().asFile.absolutePath
    webpackConfigFile.writeText(
       """
       const path = require('path');
       const WebpackObfuscator = require('webpack-obfuscator');

       module.exports = {
           entry: ${absoluteDistPath}/build/dist/js/productionLibrary/${project.name}.js',
           output: {
               filename: '${project.name}.release.js',
               path: path.resolve(__dirname, 'dist'),
               library: '${project.name}',
           },
           plugins: [
              new WebpackObfuscator({
                  rotateStringArray: true,
                  stringArray: true,
                  stringArrayEncoding: 'rc4',
                  debugProtection: "true",
                  debugProtectionInterval: true",
              })
           ]
       };
    """.trimIndent()
)
}

but I don't see the webpack.config.js file being created and obfuscation doesn't work. Any advices?

[Artem Kobzar]

It's better to not to create a webpack.config, but extend the one we are generating in KGP.
You can do it following this documentation
In a few words, you need to create a directory called webpack.config.d in the root of your project, and add inside a file with the following content:

// file obfuscator.js
const path = require('path');
const WebpackObfuscator = require('webpack-obfuscator');

config.plugins.push(new WebpackObfuscator({
   rotateStringArray: true,
   stringArray: true,
   stringArrayEncoding: 'rc4',
   debugProtection: "true",
   debugProtectionInterval: true",
}));

[Piotr Bartkowiak]

@Artem Kobzar Thank you for your reply! but I'm using binaries.library for my js (because I'm building SDK). I see down there that it works only for binaries.executable?

[Artem Kobzar]

@Ilya Goncharov [JB] do we skip Webpack processing in case of binaries.library?

[Piotr Bartkowiak]

When using binaries.library I need to do it somehow after build, manually (or with some script): obfuscate already generated .js files after processing.
I think that webpack processing is not working with library but you can confirm