在asp.net core中则可以使用BuildBundlerMinifier
来进行css,js
的压缩合并
1、使用NuGet安装 BuildBundlerMinifier
(也可以在vs中下载安装扩展Bundler & Minifier
,手动压缩文件)
2、新建:bundleconfig.json
绑定和缩减
[
{
// 要输出的捆绑文件名称。 可以包含中的相对路径bundleconfig.json文件。 必填
"outputFileName": "wwwroot/css/site.min.css",
// 要将捆绑在一起的文件的数组。 这些是配置文件的相对路径。 可选,* 空值会在空的输出文件。 组合支持模式。
"inputFiles": [
"wwwroot/css/site.css"
]
},
{
"outputFileName": "wwwroot/js/site.min.js",
"inputFiles": [
"wwwroot/js/site.js"
],
// "输出类型缩减选项。
// "可选,默认值-minify": { "enabled": true },
"minify": {
"enabled": true,
"renameLocals": true
},
// 指示是否生成捆绑的文件的源映射的标志。 可选,默认-false
"sourceMap": false,
// "指示是否将生成的文件添加到项目文件的标志。" "可选,默认-false",
"includeInProject": true
// 用于存储生成的源代码映射文件的根路径。
//"sourceMapRootPath": ""
}
]
参数说明
outputFileName
:要输出的压缩文件的相对路径(需要对应的资源时可以直接引用 outputFileName里面的 资源)。- 必填
inputFiles
:要输出的压缩文件的相对路径。- 可选,为空则输出空文件
- 空值会在空的输出文件。 支持组合模式
- 组合模式 栗子:
"inputFiles": ["wwwroot/**/*(*.css|!(*.min.css)"]
将获取所有 CSS 文件,不包括缩减的文件模式。 minify
:压缩选项的配置- 默认启用压缩,更多配置见BundlerMinifier-Wiki
- 可选
includeInProject
:将生成的文件添加到项目文件 (默认的文件中也没有这个选项)- 文档写的是 默认
false
,在vs中转到定义查看是true
。囧,默认是没有这个参数的 sourceMaps
:生成捆绑的文件的源映射- 默认
false
一、.net Core bundleconfig.json
一、bundleconfig.json
[
{
"outputFileName": "wwwroot/css/site.min.css",
"inputFiles": [ "wwwroot/**/!(*.min).css" ],
"minify": {
"enabled": true
}
}
]
目录如下
通配符:wwwroot/**/!(*.min).css
即通配符base
语法,Js一样
删除,点击项目重新生成即可,看到此文件夹下有site.min.js
二、运行后,js有效,css 文件无效。
asp.net core 2.0 bundleconfig.json
bundleconfig.json
绑定和缩减
[
{
// 要输出的捆绑文件名称。 可以包含中的相对路径bundleconfig.json文件。 必填
"outputFileName": "wwwroot/build/xxx.xxx.com/min.css",
// 要将捆绑在一起的文件的数组。 这些是配置文件的相对路径。 可选,* 空值会在空的输出文件。 组合支持模式。
"inputFiles": [
"wwwroot/bootstrap/bootstrap.css"
]
},
{
"outputFileName": "wwwroot/build/xxx.xxx.com/min.js",
"inputFiles": [
"wwwroot/jquery/jquery.min.js",
"wwwroot/knockout/knockout-3.4.2.js"
],
// "输出类型缩减选项。
// "可选,默认值-minify": { "enabled": true },
"minify": {
"enabled": true,
"renameLocals": true
},
// 指示是否生成捆绑的文件的源映射的标志。 可选,默认-false
"sourceMap": true,
// "指示是否将生成的文件添加到项目文件的标志。" "可选,默认-false",
"includeInProject": true
// 用于存储生成的源代码映射文件的根路径。
//"sourceMapRootPath": ""
}
]
添加引用:
Install-Package BuildBundlerMinifier
观察 wwwroot/build
下面就是编译好的文件