0

我使用由 Yeoman angular-fullstack生成的 MEAN 堆栈创建了一个应用程序

我很想将uncss包含在我的 grunt 构建中。

不幸的是，鉴于该网站是 SPA，这是不可能的。
我读过我可以生成站点地图，然后通过 uncss 使用它；但是，有人可以实施 uncss 并帮助我完成这个过程，因为我不知道如何真正开始？

4

1 回答 1

1

这可以通过uncss命令行或grunt-uncss... 尽管后者有未解决的问题。您提到的页面上的示例grunt-uncss使用 WordPress 站点地图 很有帮助，但没有清楚地解释如何处理 SPA。希望这会有所帮助。

1) 命令行

正如github 页面上的文档所解释的，您现在可以将 URL 直接传递到 uncss 以生成 css 输出。您可以将 URL 传递给 uncss 而不是文件...

因此，如果您的 SPA 足够简单，您可以uncss像这样使用核心应用程序：

uncss http://localhost:3000/mycoolapp > stylesheet.css

2) grunt-uncss

在撰写此答案时，需要知道通过 grunt 使用 uncss的未解决问题。grunt-uncss

虽然该url选项已折旧，但由于未解决的问题，将 URL 放入file数组的替代方法将不起作用。但是，仍然可以使用url该选项，以便可以检查 URL 数组。在这种情况下，将有这样的部分：Gruntfile.js

uncss: {
  dist: {
    options: {
      ...some options...
      urls         : ['http://localhost:3000/mycoolapp', '...'], // This is the line you need
      ...even more options...
    },

中的数组urls需要包含一个 url 列表。鉴于此插件仍在开发中，您应该观看 github 页面，以便在它基于 v.0.3.x 构建时通知您潜在的重大更改...

两个注意事项：

  • phantom.js 将用于此处理，因此只要您的 SPA 足够友好，phantom 可以完成它的工作......这应该适合您。
  • 您必须手动输入 url 数组，这就是grunt-css页面外的 WordPress 示例正在自动化的内容……所以如果您可以类似地自动化，生活会更轻松。
于 2014-07-15T15:30:35.847 回答