addyosmani / addyosmani/critical

Merge classes of multiple pages in one file

未关闭
#595 1 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看
awaiting reply
主要语言
JavaScript
星标
10.3k
派生
390
PR 合并指标
30 天内没有已合并 PR

描述

For a very large project with over 2k pages and 30+ layouts, we use [critical](https://github.com/nystudio107/rollup-plugin-critical) and that uses your library under the hood. Basically, it is possible to define uris and the template path. Critical css gets generated from the uri and the template path is just for including it into the right template.

Such a config looks like that:
```javascript
critical({
criticalUrl: env.VITE_PRIMARY_SITE_URL,
criticalBase: 'web/dist/criticalcss',
criticalPages: [
{ uri: '/', template: '_layouts/home' },
{ uri: '/content-guidelines/default-pagebuilder', template: '_layouts/default_pageBuilder' },
],
criticalConfig: {
width: 1680,
height: 1200,
user: env.VITE_BASIC_AUTH_KEY,
pass: env.VITE_BASIC_AUTH_KEY,
request: {
https: {
rejectUnauthorized: false,
},
},
},
}),
```
## Problem
The problem is that layout 1, for example, is used for 500 pages. If layout 1 looks different for 100 pages due to e.g. a different hero variant, the critical css will be generated correctly for either 100 or 400 pages. Because I can't use two urls with different heros for one style sheet.

## Solution
It would be cool if something like this would be possible:
```javascript
criticalPages: [
{ uri: ['/slug1', '/slug2'], template: '_layouts/default_teasers' },
],
```
And the CSS classes could then be merged into a single stylesheet.

If you need more information feel free to ask :)

贡献指南

打开贡献指南

评估

这个 Issue 还没有评估数据。

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。