src/types.d.ts - Code Metrics - Inspection of "Merge branch 'release/1.0.3'" - nystudio107/rollup-plugin-critical - Measure and Improve Code Quality continuously with Scrutinizer

Passed

Push — master ( c07074...1468f4 )

by Andrew

created 2021-06-01 02:53 UTC

src/types.d.ts A

↳ Parent: Project

Complexity

Total Complexity	1
Complexity/F	1

Size

Lines of Code	176
Function Count	1

Duplication

Duplicated Lines	0
Ratio	0 %

Importance

Changes

Metric	Value
eloc	113
dl	0
loc	176
rs	10
c	0
b	0
f	0
wmc	1
mnd	0
bc	0
fnc	1
bpm	0
cpm	1
noi	0

1 Function

Rating	Name	Duplication	Size	Complexity
A	types.d.ts ➔ PluginCritical	0	10	1

import {Plugin} from 'rollup';

export interface PenthouseConfig {
    /** Accessible url. Use file:/// protocol for local html files. */
    url: string;
    /** Original css to extract critical css from */
    cssString: string;
    /** Path to original css file on disk (if using instead of `cssString`) */
    css: string;
    /** Width for critical viewport */
    width: number;
    /** Height for critical viewport */
    height: number;
    /** Configuration for screenshots (not used by default). See [Screenshot example](https://github.com/pocketjoso/penthouse/blob/master/examples/screenshots.js) */
    screenshots: object;
    /** Keep media queries even for width/height values larger than critical viewport. */
    keepLargerMediaQueries: boolean;
    /**
     * Array of css selectors to keep in critical css, even if not appearing in critical viewport.
     * Strings or regex (f.e. `['.keepMeEvenIfNotSeenInDom', /^\.button/]`)
     */
    forceInclude: Array<string>;
    /**
     * Array of css selectors to remove in critical css, even if appearing in critical viewport.
     * Strings or regex (f.e. `['.doNotKeepMeEvenIfNotSeenInDom', /^\.button/]`)
     */
    forceExclude: Array<string>;
    /** Css properties to filter out from critical css */
    propertiesToRemove: Array<string>;
    /** Ms; abort critical CSS generation after this time */
    timeout: number;
    /** Settings for puppeteer. See [Custom puppeteer browser example](https://github.com/pocketjoso/penthouse/blob/master/examples/custom-browser.js) */
    puppeteer: object;
    /** Ms; stop waiting for page load after this time (for sites when page load event is unreliable) */
    pageLoadSkipTimeout: number;
    /**
     * ms; wait time after page load before critical css extraction starts
     * (also before "before" screenshot is taken, if used)
     */
    renderWaitTime: number;
    /** set to false to load JS (not recommended) */
    blockJSRequests: boolean;
    /** characters; strip out inline base64 encoded resources larger than this */
    maxEmbeddedBase64Length: number;
    /** Can be specified to limit nr of elements to inspect per css selector, reducing execution time. */
    maxElementsToCheckPerSelector: number;
    /** specify which user agent string when loading the page */
    userAgent: string;
    /** Set extra http headers to be sent with the request for the url. */
    customPageHeaders: object;
    /** For formatting of each cookie, see [Puppeteer setCookie docs](https://github.com/puppeteer/puppeteer/blob/v1.9.0/docs/api.md#pagesetcookiecookies) */
    cookies: Array<string>;
    /** Make Penthouse throw on errors parsing the original CSS. Legacy option, not recommended */
    strict: boolean;
    /**
     * Let Penthouse stop if the server response code is not matching this value. number and
     * regex types are tested against the [response.status()](https://github.com/puppeteer/puppeteer/blob/v1.14.0/docs/api.md#responsestatus). A function is also allowed and
     * gets [Response](https://github.com/puppeteer/puppeteer/blob/v1.14.0/docs/api.md#class-response) as argument. The function should return a boolean.
     */
    allowedResponseCode: number | RegExp | Function;
}

export type DeclCallback = (node: object, value: string) => boolean;

export interface CriticalConfig {
    /** Inline critical-path CSS using filamentgroup's loadCSS. Pass an object to configure `inline-critical` */
    inline: boolean;
    /** Base directory in which the source and destination are to be written */
    base: string;
    /** HTML source to be operated against. This option takes precedence over the `src` option */
    html: string;
    /** An array of paths to css files, file globs or Vinyl file objects. */
    css: Array<string>;
    /** Location of the HTML source to be operated against */
    src: string;
    /**
     * Location of where to save the output of an operation.
     * Use an object with 'html' and 'css' props if you want to store both
     */
    target: string | Partial<{
        css: string;
        html: string;
        uncritical: string;
    }>;
    /** Width of the target viewport */
    width: number;
    /** Height of the target viewport */
    height: number;
    /** Enable minification of generated critical-path */
    minify: boolean;
    /**
     * Remove the inlined styles from any stylesheets referenced in the HTML.
     * It generates new references based on extracted content so it's safe to use for
     * multiple HTML files referencing the same stylesheet. Use with caution.
     * Removing the critical CSS per page results in a unique async loaded CSS file for every page.
     * Meaning you can't rely on cache across multiple pages
     */
    extract: boolean;
    /** Inline images */
    inlineImages: boolean;
    /** List of directories/urls where the inliner should start looking for assets */
    assetPaths: Array<string>;
    /** Sets a max file size (in bytes) for base64 inlined images */
    maxImageFileSize: number;
    /**
     * Critical tries it's best to rebase the asset paths relative to the document.
     * If this doesn't work as expected you can always use this option to control the rebase paths.
     * See postcss-url for details. (https://github.com/pocketjoso/penthouse#usage-1).
     */
    rebase: object | Function;
    /** ignore CSS rules */
    ignore: Partial<{
        atrule: Array<string>;
        rule: Array<string>;
        decl: DeclCallback;
    }>;
    /** User agent to use when fetching a remote src */
    userAgent: string;
    /** Configuration options for `penthouse`. */
    penthouse: Partial<PenthouseConfig>;
    /** Configuration options for `got`. */
    request: object;
    /** RFC2617 basic authorization: `user` */
    user: string;
    /** RFC2617 basic authorization: `pass` */
    pass: string;
    /** Throw an error if no css is found */
    strict: boolean;
}

export interface CriticalPages {
    /** Combined with `criticalUrl` to determine the URLs to scrape for Critical CSS */
    uri: string;
    /** Critical CSS files are named with the `template` path, and saved to the `criticalBase` directory */
    template: string;
}

export interface CriticalPluginConfig {
    /**
     * The base URL to use in combination with the `criticalPages` `uri`s to determine the URLs to scrape for Critical CSS.
     * This can also be a file system path. This is combined with `criticalPages.uri`
     * to determine pages to scrap for critical CSS.
     * Determines the `criticalConfig.src` property
     */
    criticalUrl: string;
    /**
     * The base file system path to where the generated Critical CSS file should be saved.
     * This is combined with `criticalPages.template` with `_critical.min.css` appended
     * to it to determine the saved critical CSS file name.
     * Determines the `criticalConfig.target` property
     */
    criticalBase?: string;
    /**
     * An array objects that contain the page `uri`s that are combined with the `criticalUrl` to
     * determine the URLs to scrape for Critical CSS. The resulting files are named with the
     * `template` path, and saved to the `criticalBase` directory
     */
    criticalPages: Partial<CriticalPages>[];
    /**
     * This is the full [config for critical](https://github.com/addyosmani/critical#options) that is passed
     * through to the `critical` package.
     * You may optionally override any properties you like here
     */
    criticalConfig?: Partial<CriticalConfig>;
}

/**
 * [Vite.js](https://vitejs.dev/) & [Rollup](https://rollupjs.org/) plugin for generating critical CSS
 * that uses the [critical](https://github.com/addyosmani/critical) generator under the hood.
 *
 * @param {CriticalPluginConfig} pluginConfig - the plugin configuration object
 * @param {Function} callback - callback upon completion of the critical CSS generation
 * @constructor
 */
declare function PluginCritical(pluginConfig: CriticalPluginConfig, callback?: Function): Plugin;


1			import {Plugin} from 'rollup';
2
3			export interface PenthouseConfig {
4			/** Accessible url. Use file:/// protocol for local html files. */
5			url: string;
6			/** Original css to extract critical css from */
7			cssString: string;
8			/** Path to original css file on disk (if using instead of `cssString`) */
9			css: string;
10			/** Width for critical viewport */
11			width: number;
12			/** Height for critical viewport */
13			height: number;
14			/** Configuration for screenshots (not used by default). See [Screenshot example](https://github.com/pocketjoso/penthouse/blob/master/examples/screenshots.js) */
15			screenshots: object;
16			/** Keep media queries even for width/height values larger than critical viewport. */
17			keepLargerMediaQueries: boolean;
18			/**
19			* Array of css selectors to keep in critical css, even if not appearing in critical viewport.
20			* Strings or regex (f.e. `['.keepMeEvenIfNotSeenInDom', /^\.button/]`)
21			*/
22			forceInclude: Array<string>;
23			/**
24			* Array of css selectors to remove in critical css, even if appearing in critical viewport.
25			* Strings or regex (f.e. `['.doNotKeepMeEvenIfNotSeenInDom', /^\.button/]`)
26			*/
27			forceExclude: Array<string>;
28			/** Css properties to filter out from critical css */
29			propertiesToRemove: Array<string>;
30			/** Ms; abort critical CSS generation after this time */
31			timeout: number;
32			/** Settings for puppeteer. See [Custom puppeteer browser example](https://github.com/pocketjoso/penthouse/blob/master/examples/custom-browser.js) */
33			puppeteer: object;
34			/** Ms; stop waiting for page load after this time (for sites when page load event is unreliable) */
35			pageLoadSkipTimeout: number;
36			/**
37			* ms; wait time after page load before critical css extraction starts
38			* (also before "before" screenshot is taken, if used)
39			*/
40			renderWaitTime: number;
41			/** set to false to load JS (not recommended) */
42			blockJSRequests: boolean;
43			/** characters; strip out inline base64 encoded resources larger than this */
44			maxEmbeddedBase64Length: number;
45			/** Can be specified to limit nr of elements to inspect per css selector, reducing execution time. */
46			maxElementsToCheckPerSelector: number;
47			/** specify which user agent string when loading the page */
48			userAgent: string;
49			/** Set extra http headers to be sent with the request for the url. */
50			customPageHeaders: object;
51			/** For formatting of each cookie, see [Puppeteer setCookie docs](https://github.com/puppeteer/puppeteer/blob/v1.9.0/docs/api.md#pagesetcookiecookies) */
52			cookies: Array<string>;
53			/** Make Penthouse throw on errors parsing the original CSS. Legacy option, not recommended */
54			strict: boolean;
55			/**
56			* Let Penthouse stop if the server response code is not matching this value. number and
57			* regex types are tested against the [response.status()](https://github.com/puppeteer/puppeteer/blob/v1.14.0/docs/api.md#responsestatus). A function is also allowed and
58			* gets [Response](https://github.com/puppeteer/puppeteer/blob/v1.14.0/docs/api.md#class-response) as argument. The function should return a boolean.
59			*/
60			allowedResponseCode: number \| RegExp \| Function;
61			}
62
63			export type DeclCallback = (node: object, value: string) => boolean;
64
65			export interface CriticalConfig {
66			/** Inline critical-path CSS using filamentgroup's loadCSS. Pass an object to configure `inline-critical` */
67			inline: boolean;
68			/** Base directory in which the source and destination are to be written */
69			base: string;
70			/** HTML source to be operated against. This option takes precedence over the `src` option */
71			html: string;
72			/** An array of paths to css files, file globs or Vinyl file objects. */
73			css: Array<string>;
74			/** Location of the HTML source to be operated against */
75			src: string;
76			/**
77			* Location of where to save the output of an operation.
78			* Use an object with 'html' and 'css' props if you want to store both
79			*/
80			target: string \| Partial<{
81			css: string;
82			html: string;
83			uncritical: string;
84			}>;
85			/** Width of the target viewport */
86			width: number;
87			/** Height of the target viewport */
88			height: number;
89			/** Enable minification of generated critical-path */
90			minify: boolean;
91			/**
92			* Remove the inlined styles from any stylesheets referenced in the HTML.
93			* It generates new references based on extracted content so it's safe to use for
94			* multiple HTML files referencing the same stylesheet. Use with caution.
95			* Removing the critical CSS per page results in a unique async loaded CSS file for every page.
96			* Meaning you can't rely on cache across multiple pages
97			*/
98			extract: boolean;
99			/** Inline images */
100			inlineImages: boolean;
101			/** List of directories/urls where the inliner should start looking for assets */
102			assetPaths: Array<string>;
103			/** Sets a max file size (in bytes) for base64 inlined images */
104			maxImageFileSize: number;
105			/**
106			* Critical tries it's best to rebase the asset paths relative to the document.
107			* If this doesn't work as expected you can always use this option to control the rebase paths.
108			* See postcss-url for details. (https://github.com/pocketjoso/penthouse#usage-1).
109			*/
110			rebase: object \| Function;
111			/** ignore CSS rules */
112			ignore: Partial<{
113			atrule: Array<string>;
114			rule: Array<string>;
115			decl: DeclCallback;
116			}>;
117			/** User agent to use when fetching a remote src */
118			userAgent: string;
119			/** Configuration options for `penthouse`. */
120			penthouse: Partial<PenthouseConfig>;
121			/** Configuration options for `got`. */
122			request: object;
123			/** RFC2617 basic authorization: `user` */
124			user: string;
125			/** RFC2617 basic authorization: `pass` */
126			pass: string;
127			/** Throw an error if no css is found */
128			strict: boolean;
129			}
130
131			export interface CriticalPages {
132			/** Combined with `criticalUrl` to determine the URLs to scrape for Critical CSS */
133			uri: string;
134			/** Critical CSS files are named with the `template` path, and saved to the `criticalBase` directory */
135			template: string;
136			}
137
138			export interface CriticalPluginConfig {
139			/**
140			* The base URL to use in combination with the `criticalPages` `uri`s to determine the URLs to scrape for Critical CSS.
141			* This can also be a file system path. This is combined with `criticalPages.uri`
142			* to determine pages to scrap for critical CSS.
143			* Determines the `criticalConfig.src` property
144			*/
145			criticalUrl: string;
146			/**
147			* The base file system path to where the generated Critical CSS file should be saved.
148			* This is combined with `criticalPages.template` with `_critical.min.css` appended
149			* to it to determine the saved critical CSS file name.
150			* Determines the `criticalConfig.target` property
151			*/
152			criticalBase?: string;
153			/**
154			* An array objects that contain the page `uri`s that are combined with the `criticalUrl` to
155			* determine the URLs to scrape for Critical CSS. The resulting files are named with the
156			* `template` path, and saved to the `criticalBase` directory
157			*/
158			criticalPages: Partial<CriticalPages>[];
159			/**
160			* This is the full [config for critical](https://github.com/addyosmani/critical#options) that is passed
161			* through to the `critical` package.
162			* You may optionally override any properties you like here
163			*/
164			criticalConfig?: Partial<CriticalConfig>;
165			}
166
167			/**
168			* [Vite.js](https://vitejs.dev/) & [Rollup](https://rollupjs.org/) plugin for generating critical CSS
169			* that uses the [critical](https://github.com/addyosmani/critical) generator under the hood.
170			*
171			* @param {CriticalPluginConfig} pluginConfig - the plugin configuration object
172			* @param {Function} callback - callback upon completion of the critical CSS generation
173			* @constructor
174			*/
175			declare function PluginCritical(pluginConfig: CriticalPluginConfig, callback?: Function): Plugin;
176

nystudio107 / rollup-plugin-critical

Push — master ( c07074...1468f4 )

src/types.d.ts A

Complexity

Size

Duplication

Importance

1 Function

Duplication Side-by-Side

Filter issues like