Bundler & Minifier

Minifier——将CSS、JS、HTML文件缩小—删除注释和空格
Bundler——并且可以将多个文件合并为一个
都可以提高性能，减少网络传输的大小与数量。

捆绑：将多个文件绑在一起，就是将多个文件合成一个文件
压缩：去除空格，换行等，减少文件体积，类似bootstrap.css和bootstrap.min.css

BuildBundlerMinifier

在NuGet下载BuildBundlerMinifier包
图片.png

实例

我们先创建两个css文件

index1.css

  1. body {
  2.     font-size:20px;
  3.     color:red;
  4. }

index2.css

  1. body {
  2.        padding: 10px;
  3.        margin: 10px;
  4.    }

创建bundleconfig.json配置文件

  1. [
  2.     {
  3.       "outputFileName": "wwwroot/css/index.min.css",
  4.       "inputFiles": [
  5.         "wwwroot/index1.css",
  6.         "wwwroot/index2.css"
  7.       ]
  8.     }
  9. ]

在项目中重新生成

生成的index.min.css文件

  1. body{font-size:20px;color:#f00}body{padding:10px;margin:10px}

两个文件压缩并捆绑在一起了

也可以设置只捆绑不压缩

  1. [
  2.   {
  3.     "outputFileName": "wwwroot/css/index.min.css",
  4.     "inputFiles": [
  5.       "wwwroot/index1.css",
  6.       "wwwroot/index2.css"
  7.     ],
  8.     "minify": { "enabled": false } //只捆绑不压缩
  9.   }
  10. ]