[Gradle, JS] Add css settings to config

#KT-32721 fixed

libraries/tools/kotlin-gradle-plugin/src/main/kotlin/org/jetbrains/kotlin/gradle/targets/js/webpack/KotlinWebpackConfig.kt

@@ -12,7 +12,7 @@ import org.jetbrains.kotlin.gradle.targets.js.NpmVersions
 import org.jetbrains.kotlin.gradle.targets.js.RequiredKotlinJsDependency
 import org.jetbrains.kotlin.gradle.targets.js.appendConfigsFromDir
 import org.jetbrains.kotlin.gradle.targets.js.jsQuoted
-import org.jetbrains.kotlin.gradle.targets.js.webpack.KotlinWebpackCssExtractPolicy.*
+import org.jetbrains.kotlin.gradle.targets.js.webpack.KotlinWebpackAssetExtractPolicy.*
 import java.io.File
 import java.io.Serializable
 import java.io.StringWriter
@@ -54,6 +54,17 @@ data class KotlinWebpackConfig(
             if (devServer != null) {
                 it.add(versions.webpackDevServer)
             }
+
+            if (cssSettings == null || !cssSettings.enabled) return@also
+
+            it.add(versions.cssLoader)
+            if (cssSettings.extractPolicy in listOf(NONE, DEPENDS_ON_MODE)) {
+                it.add(versions.styleLoader)
+            }
+
+            if (cssSettings.extractPolicy in listOf(ALWAYS, DEPENDS_ON_MODE)) {
+                it.add(versions.miniCssExtractPlugin)
+            }
         }
 
     enum class Mode(val code: String) {
@@ -115,6 +126,7 @@ data class KotlinWebpackConfig(
             appendDevServer()
             appendReport()
             appendProgressReporter()
+            appendCssSettings()
             appendFromConfigDir()
             appendEvaluatedFileReport()
 
@@ -140,6 +152,7 @@ data class KotlinWebpackConfig(
                     const evaluatedConfig = util.inspect(config, {showHidden: false, depth: null, compact: false});
                     fs.writeFile($filePath, evaluatedConfig, function (err) {});
                 })(config);
+                
             """.trimIndent()
         )
     }
@@ -248,65 +261,65 @@ data class KotlinWebpackConfig(
             """.trimIndent()
         )
 
-        //language=ES6
         appendln(
             """
-            const use = [
+        |    const use = [
-                {
+        |        {
-                    loader: 'css-loader',
+        |            loader: 'css-loader',
-                    options: {},
+        |            options: {},
-                }
+        |        }
-            ]
+        |    ]
-            """.trimIndent()
+            """.trimMargin()
         )
 
-        //language=ES6
+        val extractedCss =
-        val extractedCss = """
+            """
-                const MiniCssExtractPlugin = require('mini-css-extract-plugin');
+            |    const MiniCssExtractPlugin = require('mini-css-extract-plugin');
-                use.unshift({
+            |    use.unshift({
-                    loader: MiniCssExtractPlugin.loader,
+            |        loader: MiniCssExtractPlugin.loader,
-                    options: {}
+            |        options: {}
-                })
+            |    })
-                plugins.push(new MiniCssExtractPlugin())
+            |    config.plugins.push(new MiniCssExtractPlugin())
-            """.trimIndent()
+            """
 
-        //language=ES6
+        val nonExtractedCss =
-        val nonExtractedCss = """
+            """
-                use.unshift({
+            |    use.unshift({
-                    loader: 'style-loader',
+            |        loader: 'style-loader',
-                    options: {}
+            |        options: {}
-                })
+            |    })
-            """.trimIndent()
+            |    
+            """
 
         val extractedSettings = when (cssSettings.extractPolicy) {
             ALWAYS -> extractedCss
-            //language=ES6
+            DEPENDS_ON_MODE ->
-            DEPENDS_ON_MODE -> """
+                """
-                if (config.mode === 'production') {
+            |    if (config.mode === 'production') {
-                    $extractedCss
+            |        $extractedCss
-                } else {
+            |    } else {
-                    $nonExtractedCss
+            |        $nonExtractedCss
-                }
+            |    }
-            """.trimIndent()
+            """.trimMargin()
             NONE -> nonExtractedCss
         }
 
         appendln(extractedSettings)
 
-        //language=ES6
         appendln(
             """
-                config.module.rules.push({
+            |    config.module.rules.push({
-                    test: /\.css${'$'}/,
+            |        test: /\.css${'$'}/,
-                    use: use
+            |        use: use
-                })
+            |    })
 
-            """.trimIndent()
+            """.trimMargin()
         )
 
         appendln(
             """
             })(config);
+            
             """.trimIndent()
         )
     }
@@ -345,6 +358,7 @@ data class KotlinWebpackConfig(
             
                     config.plugins.push(new webpack.ProgressPlugin(handler))
                 })(config);
+                
             """.trimIndent()
         )
     }