Bundler和Minifier Visual Studio扩展
原文地址:https://marketplace.visualstudio.com/items?itemName=MadsKristensen.BundlerMinifier
特征
- 将CSS,JavaScript或HTML文件捆绑到单个输出文件中
- 保存源文件会自动触发重新捆绑
- 支持globbing模式
- MSBuild支持支持CI方案
- 缩小单个或捆绑的CSS,JavaScript和HTML文件
- 每种语言的缩小选项都是可自定义的
- 打开生成的文件时显示水印
- Task Runner Explorer集成
- 命令行支持
- 更新解决方案中所有捆绑包的快捷方式
- 抑制输出文件生成
- 转换为Gulp
关于编码的说明
没有BOM(字节顺序标记)的所有文件都被视为UTF-8。如果在输出包文件中看到奇怪的字符,则可能需要考虑将输入文件保存为UTF-8或允许您指定BOM的编码。
捆绑
在解决方案资源管理器中选择2个或更多相同类型的文件以创建捆绑包。
对源文件进行的任何编辑都将立即生成更新的捆绑文件输出。
捆绑包配置存储在一个名为的文件中,该文件bundleconfig.json
将添加到项目的根目录中。
缩小
在解决方案资源管理器中右键单击任何JS,CSS或HTML文件。这将创建一个[filename] .min。[ext]并将其嵌套在原始文件下。
修改原始文件后,会立即生成新的min文件。
捆绑构建/ CI支持
在ASP.NET MVC和WebForms项目中,您可以在构建步骤中启用捆绑和缩小。只需右键单击该bundleconfig.json
文件即可启用它。
单击该菜单项将提示您有关单击“确定”按钮时将发生的情况的信息。
NuGet包将安装到该packages
文件夹中,而不会向项目本身添加任何文件。该NuGet包中包含一个MSBuild任务,该任务将bundleconfig.json
在项目根目录中的文件上运行完全相同的编译器。
对于ASP.NET Core项目,请参阅wiki
更新所有捆绑包
您可以bundleconfig.json
使用键盘快捷键Shift+Alt+i
或使用顶级“生成”菜单上的按钮在解决方案中的所有文件上运行bundler 。
来源地图
目前仅支持JavaScript缩小源映射。
一个.map
文件的下一次成功的.min.js
文件自动,但如果你手动删除.map
文件,新的人会不会在随后的minifications创建。
要启用源映射,请将此属性添加到bundleconfig.json
文件中:
“ sourceMap ”:是的
任务运行资源管理器
快速浏览您指定的文件或直接在Task Runner Explorer中执行捆绑包。
您甚至可以设置绑定,以便在某些Visual Studio事件(例如BeforeBuild和Project Open)期间自动发生捆绑/缩小。
抑制输出文件生成
有些情况下,您不希望扩展程序监听文件更改并生成捆绑和缩小的输出。如果您想使用Gulp bundleconfig.json
或使用服务器端代码,那可能就是这样。在这些情况下,让bundleconfig.json
文件包含所有Visual Studio工具仍然有用,但让其他工具处理捆绑和缩小过程。
要取消输出,请删除右键菜单中的复选框bundleconfig.json
。
转换为Gulp
此功能使您可以根据已配置的内容轻松开始使用Gulp bundleconfig.json
。它将创建gulpfile.js
, package.js
如果它们尚不存在,则使用npm安装所需的节点模块。
该gulpfile.js
会消耗bundleconfig.json
来获取输入和输出文件的路径,但会使用普通一饮而尽插件来完成所有的捆绑和缩小。您可以修改它以使用其他插件而不会失去其阅读能力bundleconfig.json
。
阅读更多相关信息,并在维基上查看代码示例。
bundleconfig.json
扩展bundleconfig.json
在项目的根目录添加一个文件,用于配置所有捆绑。
以下是该文件的示例:
[ { "outputFileName": "output/bundle.css", "inputFiles": [ "css/lib/**/*.css", // globbing patterns are supported "css/input/site.css" ], "minify": { "enabled": true, "commentMode": "all" } }, { "outputFileName": "output/all.js", "inputFiles": [ "js/*.js", "!js/ignore.js" // start with a ! to exclude files ] }, { "outputFileName": "output/app.js", "inputFiles": [ "input/main.js", "input/core/*.js" // all .js files in input/core/ ] } ]
有助于
如果您想为此项目做出贡献,请查看贡献指南。
要自己克隆和构建此项目,请确保为Visual Studio 安装Extensibility Tools 2015扩展,该扩展启用了此项目使用的某些功能。
Bundler和Minifier Visual Studio扩展的更多相关文章
- Productivity Power Tools 是微软官方推出的 Visual Studio 扩展
Productivity Power Tools 是微软官方推出的 Visual Studio 扩展 免费的精品: Productivity Power Tools 动画演示
- Visual Studio 扩展包(.vsix)制作
前言:上篇介绍了 Visual Studio扩展工具添加与卸载,本编要介绍的是Visual Studio 扩展包(.vsix)的制作. 方法: ①.下载并安装Visual Studio 2010 SD ...
- 最棒的Visual Studio扩展
isual Studio是微软公司推出的开发环境,Visual Studio可以用来创建Windows平台下的Windows应用程序和网络应用程序,也可以用来创建网络服务.智能设备应用程序和Offic ...
- 写了一个远程桌面管理的Visual Studio扩展程序
最近看了写Visual Studio扩展相关的一些资料,周末写了一个远程桌面管理器的扩展程序来练练手,由于和VisualStudio集成了,无需切换窗口,用起来还是觉得挺方便的. 关于远程桌面管理器的 ...
- Web编译器Visual Studio扩展
原文地址:https://marketplace.visualstudio.com/items?itemName=MadsKristensen.WebCompiler 一个Visual Studio扩 ...
- 让编程更轻松的 7 个 Visual Studio 扩展 : 以下几个扩展,BuildVision可以用
是时候升级你最喜欢的IDE了!在这篇文章中,我将介绍一些我最喜欢的与众不同的 Visual Studio 扩展,是它们让我的日常编程工作变得更加轻松.对于一些明摆着的,例如 ReSharper 和 O ...
- 当 Visual Studio 扩展遇到错误时
我是遇到了 Github 扩展经常在 Visual Studio 启动时报错,找了一下可以尝试以下方法: 首先卸载插件 然后删除 %LocalAppData%\Microsoft\VisualStud ...
- Visual Studio扩展与更新中插件被禁用,安装后无法使用
在Visual Studio中的扩展与更新中安装插件后,显示[禁用],重新安装后仍然不能使用,但是VS默认安装的扩展却可以正常使用. 这里需要注意下方显示“当前不允许加载每用户扩展”,点击“启用每用户 ...
- 使用Visual Studio扩展插件Visual assist X给代码插入注释模板
Visual Assist 是由Whole Tomato公司为Microsoft Visual Studio开发的一款插件.它对Visual Studio的智能提示功能和代码高亮功能进行了增强,同时还 ...
随机推荐
- java笔试之字符串反转
写出一个程序,接受一个字符串,然后输出该字符串反转后的字符串. package test; import java.util.Scanner; public class exam04 { public ...
- LeetCode387First Unique Character in a String字符串中第一个唯一字符
给定一个字符串,找到它的第一个不重复的字符,并返回它的索引.如果不存在,则返回 -1. 案例: s = "leetcode" 返回 0. s = "loveleetcod ...
- HZOI20190828模拟32题解
题面:https://www.cnblogs.com/Juve/articles/11428730.html chinese: 考虑$\sum\limits_{i=0}^{n*m}i*f_i$的意义: ...
- HZOI2019序列
题目链接:https://www.cnblogs.com/Juve/articles/11186805.html(密码是我的一个oj用户名) 题解: 这题我考试打的暴力,只有5分. 一开始理解错题意了 ...
- RxJS 入门指引和初步应用
作者:徐飞链接:https://zhuanlan.zhihu.com/p/25383159来源:知乎著作权归作者所有.商业转载请联系作者获得授权,非商业转载请注明出处. RxJS是一个强大的React ...
- httpclient遇到java.net.URISyntaxException: Illegal character in scheme name at index 0:
正准备按照大佬的解决办法处理, 看会一条回复,说url有空格 检查了一下,还真是有空格 去除url中的空格,问题解除
- react-native连接华为真机
android studio的设置:下载google USB Driver 手机部分1.找到手机开发者模式 设置->系统->关于手机->版本号(多次点击出现开发者模式) 提示你已在开 ...
- UVA11021 Tribbles
题目大意:n个麻球,第一天有k个,麻球生命期为一天,临近死亡前会有i的几率生出Pi个麻球.问m天后麻球全部死亡概率 设f[i]表示i天后一个麻球全部死亡的概率 有f[1] = P0 f[i] = P0 ...
- Redis 持久化之RDB和AOF详解
一.RDB 详解 RDB 是 Redis 默认的持久化方案.在指定的时间间隔内,执行指定次数的写操作,则会将内存中的数据写入到磁盘中.即在指定目录下生成一个dump.rdb文件.Redis 重启会通过 ...
- vim编辑器操作②
本文主要介绍vim的常用编辑命令: 字符编辑: x:删除光标所在处的字符: #x:删除光标所在处起始的#个字符: 替换命令: r:替换光标所在处的字符: rCHAR; 例如:替换list中的l为大写L ...