当前位置 : 主页 > 网络编程 > 其它编程 >

你如何可靠地跟踪CSS使用

来源:互联网 收集:自由互联 发布时间:2023-07-02
MyenvironmentisVisualStudio2010withResharper6.0.IhavealargewebsitewithmanyCSSfiles My environment is Visual Studio 2010 with Resharper 6.0. I have a large website with many CSS files with many styles. 我的环境是带有Resharper 6.0的Vis
MyenvironmentisVisualStudio2010withResharper6.0.IhavealargewebsitewithmanyCSSfiles

My environment is Visual Studio 2010 with Resharper 6.0. I have a large website with many CSS files with many styles.

我的环境是带有Resharper 6.0的Visual Studio 2010。我有一个包含许多样式的CSS文件的大型网站。

I would like to tidy these up as a lot of them are no longer used, I noticed that Resharper allows you to track usages but obviously this can miss out CSS class specifications in code-behind etc.

我想整理它们,因为很多不再使用它们,我注意到Resharper允许你跟踪用法,但显然这可能会错过代码隐藏等方面的CSS类规范。

My only solution is to do a Find In Files in VS but obviously when you have a large amount of styles this proves too slow and cumbersome.

我唯一的解决方案是在VS中查找文件,但显然当你有大量的样式时,这证明太慢和麻烦。

Has anyone had a similar predicament?

有没有人有类似的困境?

EDIT: It's worth mentioning that the site is a CMS comprising around 10,000 pages, so anything that requires browsing pages might also be a bit tricky.

编辑:值得一提的是,该网站是一个包含大约10,000页的CMS,所以任何需要浏览页面的东西也可能有点棘手。

3 个解决方案

#1

3

There is a firefox extension called dust me selector that does this. You enable it and then navigate to each page. It keeps track of all used css. You spit out a new css file with all the tracked css styles.

有一个名为dust me选择器的firefox扩展程序就是这样做的。您启用它然后导航到每个页面。它跟踪所有使用的CSS。您吐出一个包含所有跟踪的CSS样式的新css文件。

#2

2

The Web Essentials Visual Studio Extension has a BrowserLink feature which comes with a way to track unused css in your site while you browse around the site.

Web Essentials Visual Studio Extension具有BrowserLink功能,可以在浏览网站时跟踪站点中未使用的css。

#3

2

A way to do that is running your site in a headless browser like PhantomJS and inspecting the styles applied in order to remove the ones not being used.

一种方法是在PhantomJS之类的无头浏览器中运行您的站点,并检查应用的样式以删除未使用的样式。

Fortunately, there is a nice tool built on node called uncss doing exactly this:

幸运的是,有一个很好的工具构建在名为uncss的节点上,正是这样做的:

https://github.com/giakki/uncss

I found it here:

我在这里找到了:

http://addyosmani.com/blog/removing-unused-css/

About browsing all those pages, well, I dunno, if you can generate all the possible URL's then you can automate the process.

关于浏览所有这些页面,好吧,我不知道,如果你可以生成所有可能的URL,那么你可以自动化这个过程。

Give it a try and let me know if it helps.

尝试一下,让我知道它是否有帮助。

上一篇:物联网IOT定位技术详解
下一篇:没有了
网友评论