0

为了运行uncss以删除未使用的 css 规则,我需要生成一个包含角度模板使用的所有 css 规则的页面。我认为Rendertron可能适合这个用例,但想知道是否可以使用 Angular CLI 做同样的事情?

例如,如果我们运行ng buildangular 将生成一个dist/index.html文件,其中包含文件中的自定义元素选择器dist/index.html。但是,这不能以uncss为目标,因为尚未呈现模板。它仍然由 example 表示<app-root>,因此uncss看不到<app-root>模板应用的 css 规则。

4

1 回答 1

1

是的,默认情况下,所有编译的 CSS 和 js 文件都将通过 angular cli 生成到 dist 文件夹中。如果需要,您可以使用项目中存在的 angular-cli.json 进行配置。正如您在下面的index.html示例中所见,它包含所有 css 和 JS 文件的路径。通常它会创建一个 css 文件,因为最好在一个请求中加载整个 css。

<!doctype html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>My APP</title>
  <base href="/">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <link href="styles.3e523e6b74c68b0940ab.bundle.css" rel="stylesheet" />
</head>

<body>
  <app-root></app-root>
  <script type="text/javascript" src="inline.5d1afc94d5922f9e85f3.bundle.js"></script>
  <script type="text/javascript" src="polyfills.45da1a3263e1321501bf.bundle.js"></script>
  <script type="text/javascript" src="scripts.4d46a754e6ffe4a0ff23.bundle.js"></script>
  <script type="text/javascript" src="main.cec0d2d86e8c98d02873.bundle.js"></script>
</body>

</html>

您还可以指示 cli 将任何供应商特定的 CSS/js 分成单独的文件。点击链接了解更多关于配置的信息。

因为,您将在uncss中指定所有 css 和 js ,因此您可以使用 dist 文件夹内容。

于 2018-04-26T01:46:36.160 回答