[Gradle, JS] Reorganize css settings with rules
#KT-38055 fixed
This commit is contained in:
+73
-42
@@ -57,16 +57,19 @@ data class KotlinWebpackConfig(
|
||||
it.add(versions.webpackDevServer)
|
||||
}
|
||||
|
||||
if (!cssSettings.enabled) return@also
|
||||
if (!cssSettings.enabled || cssSettings.rules.isEmpty()) return@also
|
||||
|
||||
it.add(versions.cssLoader)
|
||||
when (cssSettings.mode) {
|
||||
EXTRACT -> it.add(versions.miniCssExtractPlugin)
|
||||
INLINE -> it.add(versions.styleLoader)
|
||||
IMPORT -> {
|
||||
cssSettings.rules.forEach { rule ->
|
||||
when (rule.mode) {
|
||||
EXTRACT -> it.add(versions.miniCssExtractPlugin)
|
||||
INLINE -> it.add(versions.styleLoader)
|
||||
IMPORT -> {
|
||||
}
|
||||
else -> cssError()
|
||||
}
|
||||
else -> cssError()
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
enum class Mode(val code: String) {
|
||||
@@ -253,7 +256,7 @@ data class KotlinWebpackConfig(
|
||||
}
|
||||
|
||||
private fun Appendable.appendCssSettings() {
|
||||
if (!cssSettings.enabled)
|
||||
if (!cssSettings.enabled || cssSettings.rules.isEmpty())
|
||||
return
|
||||
|
||||
appendln(
|
||||
@@ -263,53 +266,81 @@ data class KotlinWebpackConfig(
|
||||
""".trimIndent()
|
||||
)
|
||||
|
||||
appendln(
|
||||
"""
|
||||
| const use = [
|
||||
| {
|
||||
| loader: 'css-loader',
|
||||
| options: {},
|
||||
| }
|
||||
| ]
|
||||
""".trimMargin()
|
||||
)
|
||||
|
||||
val extractedCss =
|
||||
"""
|
||||
| const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
||||
| use.unshift({
|
||||
| loader: MiniCssExtractPlugin.loader,
|
||||
| options: {}
|
||||
| })
|
||||
| config.plugins.push(new MiniCssExtractPlugin())
|
||||
| const MiniCssExtractPlugin = require('mini-css-extract-plugin');
|
||||
| use.unshift({
|
||||
| loader: MiniCssExtractPlugin.loader,
|
||||
| options: {}
|
||||
| })
|
||||
| config.plugins.push(new MiniCssExtractPlugin())
|
||||
""".trimMargin()
|
||||
|
||||
val inlinedCss =
|
||||
"""
|
||||
| use.unshift({
|
||||
| loader: 'style-loader',
|
||||
| options: {}
|
||||
| })
|
||||
|
|
||||
| use.unshift({
|
||||
| loader: 'style-loader',
|
||||
| options: {}
|
||||
| })
|
||||
|
|
||||
""".trimMargin()
|
||||
|
||||
when (cssSettings.mode) {
|
||||
EXTRACT -> appendln(extractedCss)
|
||||
INLINE -> appendln(inlinedCss)
|
||||
IMPORT -> {
|
||||
cssSettings.rules.forEach { rule ->
|
||||
appendln(
|
||||
"""
|
||||
| ;(function(config) {
|
||||
""".trimMargin()
|
||||
)
|
||||
appendln(
|
||||
"""
|
||||
| const use = [
|
||||
| {
|
||||
| loader: 'css-loader',
|
||||
| options: {},
|
||||
| }
|
||||
| ]
|
||||
""".trimMargin()
|
||||
)
|
||||
|
||||
when (rule.mode) {
|
||||
EXTRACT -> appendln(extractedCss)
|
||||
INLINE -> appendln(inlinedCss)
|
||||
IMPORT -> {
|
||||
}
|
||||
else -> cssError()
|
||||
}
|
||||
else -> cssError()
|
||||
}
|
||||
|
||||
appendln(
|
||||
"""
|
||||
| config.module.rules.push({
|
||||
| test: /\.css${'$'}/,
|
||||
| use: use
|
||||
| })
|
||||
val excluded = rule.exclude.let {
|
||||
if (it.isNotEmpty()) {
|
||||
"[${it.joinToString()}]"
|
||||
} else null
|
||||
}
|
||||
|
||||
val included = rule.include.let {
|
||||
if (it.isNotEmpty()) {
|
||||
"[${it.joinToString()}]"
|
||||
} else null
|
||||
}
|
||||
|
||||
appendln(
|
||||
"""
|
||||
| config.module.rules.push({
|
||||
| test: /\.css${'$'}/,
|
||||
| use: use,
|
||||
| ${excluded?.let { "exclude: $it," } ?: ""}
|
||||
| ${included?.let { "include: $it" } ?: ""}
|
||||
| })
|
||||
|
||||
""".trimMargin()
|
||||
)
|
||||
)
|
||||
|
||||
appendln(
|
||||
"""
|
||||
| })(config);
|
||||
|
||||
""".trimMargin()
|
||||
)
|
||||
}
|
||||
|
||||
appendln(
|
||||
"""
|
||||
|
||||
+33
-1
@@ -6,14 +6,46 @@
|
||||
package org.jetbrains.kotlin.gradle.targets.js.webpack
|
||||
|
||||
import org.gradle.api.tasks.Input
|
||||
import org.gradle.api.tasks.Internal
|
||||
import org.gradle.api.tasks.Nested
|
||||
import org.jetbrains.kotlin.gradle.targets.js.webpack.KotlinWebpackCssMode.INLINE
|
||||
|
||||
data class KotlinWebpackCssSettings(
|
||||
@Input
|
||||
var enabled: Boolean = true,
|
||||
|
||||
@Nested
|
||||
var rules: MutableList<KotlinWebpackCssRule> = mutableListOf(
|
||||
KotlinWebpackCssRule()
|
||||
)
|
||||
) {
|
||||
@get:Internal
|
||||
var mode: String
|
||||
get() =
|
||||
rules
|
||||
.singleOrNull()
|
||||
?.mode ?: singleRuleError()
|
||||
set(value) {
|
||||
rules.singleOrNull()
|
||||
?.let {
|
||||
it.mode = value
|
||||
} ?: singleRuleError()
|
||||
}
|
||||
|
||||
private fun singleRuleError(): Nothing {
|
||||
throw error("CSS mode shortcut can be applied only with one css rule")
|
||||
}
|
||||
}
|
||||
|
||||
data class KotlinWebpackCssRule(
|
||||
@Input
|
||||
var mode: String = INLINE
|
||||
var mode: String = INLINE,
|
||||
|
||||
@Input
|
||||
var include: MutableList<String> = mutableListOf(),
|
||||
|
||||
@Input
|
||||
var exclude: MutableList<String> = mutableListOf()
|
||||
)
|
||||
|
||||
object KotlinWebpackCssMode {
|
||||
|
||||
Reference in New Issue
Block a user