Add conditional css to bundleconfig

Question

I have 2 css files. and both of them are for all pages except that one of them is the fix for right to left languages and it will exist in all pages when a right to left culture is selected, and will be in none of them otherwise.

Current definition in Layout file:

<environment names="Development">
    <link rel="stylesheet" href="~/css/site.css" />
</environment>
<environment names="Staging,Production">
    <link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true" />
</environment>

bundleconfig.json:

{
    "outputFileName": "wwwroot/css/site.min.css",
    // An array of relative input file paths. Globbing patterns supported
    "inputFiles": [
      "wwwroot/css/site.css"
    ]
  },
  {
    "outputFileName": "wwwroot/js/site.min.js",
    "inputFiles": [
      "wwwroot/js/site.js"
    ],
    // Optionally specify minification options
    "minify": {
      "enabled": true,
      "renameLocals": true
    },
    // Optionally generate .map file
    "sourceMap": false
  }

Is there any way to include it in the bundling when needed? I don't want to include it separately.

Answer 1

I solved the problem.

In bundleconfig.json I choose to create 2 different minified css, one with rtl patch and one without it:

[
  {
    "outputFileName": "wwwroot/css/site.min.css",
    // An array of relative input file paths. Globbing patterns supported
    "inputFiles": [
      "wwwroot/css/site.css"
    ]
  },
  {
    "outputFileName": "wwwroot/css/sitertl.min.css",
    // An array of relative input file paths. Globbing patterns supported
    "inputFiles": [
      "wwwroot/css/site.css",
      "wwwroot/css/rtl.css"
    ]
  },
  {
    "outputFileName": "wwwroot/js/site.min.js",
    "inputFiles": [
      "wwwroot/js/site.js"
    ],
    // Optionally specify minification options
    "minify": {
      "enabled": true,
      "renameLocals": true
    },
    // Optionally generate .map file
    "sourceMap": false
  }
]

And in layout I add a condition like this:

    <environment names="Development">
            <link rel="stylesheet" href="~/css/site.css" />
           @if (CultureInfo.CurrentUICulture.Name.ToLower() == "fa-ir")
           { <link href="~/css/rtl.css" rel="stylesheet" />}
        </environment>
        <environment names="Staging,Production">
@if(CultureInfo.CurrentUICulture.Name.ToLower()=="fa-ir"){
            <link rel="stylesheet" href="~/css/sitertl.min.css" asp-append-version="true"  />}
else{
<link rel="stylesheet" href="~/css/site.min.css" asp-append-version="true"  />
}
        </environment>