chore(CssBundler): add css-bundler tools (#6841)

* chore: 增加 css-bundler 工具

* chore: 增加配置

* chore: 删除生成文件

* chore: 更新打包配置

* chore: 集成打包工具

* chore:  更新打包配置文件

* chore: 更新忽略文件

* chore: 更新样式配置文件

* doc: 增加本地化

* doc: 更新 ColorPicker 示例

* refactor: 更改为增量执行

* chore: 更改任务名称

* test: 更新单元测试

* chore: bump version 9.11.1-beta05

* refactor: 更新脚本

* chore: 更新脚本

.gitignore

@@ -376,3 +376,6 @@ src/**/wwwroot/**/uploader
 # Bootstrap
 **/BootstrapBlazor/wwwroot/js/bootstrap.blazor.bundle.min.js
 **/BootstrapBlazor/wwwroot/css/bootstrapblazor.min.css
+
+# css
+**/BootstrapBlazor/wwwroot/css/bootstrap.blazor.bundle.*.css

dotnet-tools.json

@@ -0,0 +1,13 @@
+{
+  "version": 1,
+  "isRoot": true,
+  "tools": {
+    "bootstrapblazor.cssbundler": {
+      "version": "1.0.0",
+      "commands": [
+        "css-bundler"
+      ],
+      "rollForward": false
+    }
+  }
+}

src/BootstrapBlazor/BootstrapBlazor.csproj

@@ -1,7 +1,7 @@
 <Project Sdk="Microsoft.NET.Sdk.Razor">
 
   <PropertyGroup>
-    <Version>9.11.1-beta04</Version>
+    <Version>9.11.1-beta05</Version>
   </PropertyGroup>
 
   <ItemGroup>
@@ -10,18 +10,16 @@
   </ItemGroup>
 
   <ItemGroup>
-    <Content Remove="wwwroot\core\bootstrap\css\bootstrap.css" />
+    <Content Remove="wwwroot\core\bootstrap\**\*.*" />
-    <Content Remove="wwwroot\core\bootstrap\css\bootstrap.rtl.css" />
+    <Content Remove="wwwroot\lib\animate\*.css" />
-    <Content Remove="wwwroot\core\bootstrap\js\bootstrap.bundle.js" />
+    <Content Remove="wwwroot\lib\swal\*.css" />
-    <Content Remove="wwwroot\core\bootstrap\js\bootstrap.bundle.min.js" />
-    <Content Remove="wwwroot\lib\swal\sweetalert2.css" />
     <Content Remove="wwwroot\scss\*" />
-    <None Include="wwwroot\core\bootstrap\css\bootstrap.css" />
+    <Content Remove="wwwroot\css\bootstrapblazor.min.css" />
-    <None Include="wwwroot\core\bootstrap\css\bootstrap.rtl.css" />
+    <None Include="wwwroot\core\bootstrap\**\*.*" />
-    <None Include="wwwroot\core\bootstrap\js\bootstrap.bundle.js" />
+    <None Include="wwwroot\lib\animate\*.css" />
-    <None Include="wwwroot\core\bootstrap\js\bootstrap.bundle.min.js" />
+    <None Include="wwwroot\lib\swal\*.css" />
-    <None Include="wwwroot\lib\swal\sweetalert2.css" />
     <None Include="wwwroot\scss\*" />
+    <None Include="wwwroot\css\bootstrapblazor.min.css" />
   </ItemGroup>
 
   <ItemGroup>

src/BootstrapBlazor/Directory.Build.targets

@@ -7,13 +7,21 @@
   </ItemGroup>
 
   <PropertyGroup>
-    <BootstrapBundleFile>$(MSBuildThisFileDirectory)wwwroot/core/bootstrap/js/bootstrap.bundle.min.js</BootstrapBundleFile>
+    <BootstrapOriginJsFile>$(MSBuildThisFileDirectory)wwwroot/core/bootstrap/js/bootstrap.bundle.min.js</BootstrapOriginJsFile>
-    <TargetBootstrapBundleFile>$(MSBuildThisFileDirectory)wwwroot/js/bootstrap.blazor.bundle.min.js</TargetBootstrapBundleFile>
+    <BootstrapTargetJsFile>$(MSBuildThisFileDirectory)wwwroot/js/bootstrap.blazor.bundle.min.js</BootstrapTargetJsFile>
+    <StyleFile>$(MSBuildThisFileDirectory)wwwroot/css/bootstrapblazor.min.css</StyleFile>
+    <BundleStyleFile>$(MSBuildThisFileDirectory)wwwroot/css/bootstrap.blazor.bundle.min.css;$(MSBuildThisFileDirectory)wwwroot/css/bootstrap.blazor.bundle.rtl.min.css</BundleStyleFile>
   </PropertyGroup>
 
-  <Target Name="CopyCss" AfterTargets="Build" Condition="'$(TargetFramework)' == '$(RunTargetFramework)'">
+  <Target Name="CopyJs" AfterTargets="Build" Condition="'$(TargetFramework)' == '$(RunTargetFramework)'" Inputs="$(BootstrapOriginJsFile)" Outputs="$(BootstrapTargetJsFile)">
     <Message Text="Copy bootstrap.bundle.min.js ..." Importance="high"></Message>
-    <Copy SourceFiles="$(BootstrapBundleFile)" DestinationFiles="$(TargetBootstrapBundleFile)" SkipUnchangedFiles="true"></Copy>
+    <Copy SourceFiles="$(BootstrapOriginJsFile)" DestinationFiles="$(BootstrapTargetJsFile)" SkipUnchangedFiles="true"></Copy>
+  </Target>
+
+  <Target Name="CssBundler" AfterTargets="CopyJs" Condition="'$(TargetFramework)' == '$(RunTargetFramework)'" Inputs="$(StyleFile)" Outputs="$(BundleStyleFile)">
+    <Message Text="Bundler min css ..." Importance="high"></Message>
+    <Exec Command="dotnet tool restore"></Exec>
+    <Exec Command="dotnet css-bundler $(MSBuildThisFileDirectory)bundler.json"></Exec>
   </Target>
 
 </Project>

src/BootstrapBlazor/bundler.json

@@ -0,0 +1,20 @@
+[
+  {
+    "outputFileName": "wwwroot/css/bootstrap.blazor.bundle.min.css",
+    "inputFiles": [
+      "wwwroot/core/bootstrap/css/bootstrap.min.css",
+      "wwwroot/css/bootstrapblazor.min.css",
+      "wwwroot/lib/animate/animate.min.css",
+      "wwwroot/lib/swal/sweetalert2.min.css"
+    ]
+  },
+  {
+    "outputFileName": "wwwroot/css/bootstrap.blazor.bundle.rtl.min.css",
+    "inputFiles": [
+      "wwwroot/core/bootstrap/css/bootstrap.rtl.min.css",
+      "wwwroot/css/bootstrapblazor.min.css",
+      "wwwroot/lib/animate/animate.min.css",
+      "wwwroot/lib/swal/sweetalert2.min.css"
+    ]
+  }
+]

src/BootstrapBlazor/wwwroot/css/bootstrap.blazor.bundle.min.css

@@ -1,4 +0,0 @@
-@import url('../core/bootstrap/css/bootstrap.min.css');
-@import url('bootstrapblazor.min.css');
-@import url('../lib/animate/animate.min.css');
-@import url('../lib/swal/sweetalert2.min.css');

src/BootstrapBlazor/wwwroot/css/bootstrap.blazor.bundle.rtl.min.css

@@ -1,4 +0,0 @@
-@import url('../core/bootstrap/css/bootstrap.rtl.min.css');
-@import url('bootstrapblazor.min.css');
-@import url('../lib/animate/animate.min.css');
-@import url('../lib/swal/sweetalert2.min.css');