UNPKG

rollup-plugin-styles

Version:

Universal Rollup plugin for styles: PostCSS, Sass, Less, Stylus and more

401 lines (392 loc) 12.4 kB
/// <reference types="./typings/sass" /> /// <reference types="./typings/less" /> /// <reference types="./typings/postcss-modules" /> import { PluginContext, Plugin as Plugin$1 } from 'rollup'; import postcss from 'postcss'; import cssnano from 'cssnano'; import { CreateFilter } from '@rollup/pluginutils'; import { Importer } from 'sass'; import { Plugin } from 'less'; import { LocalByDefaultOptions } from 'postcss-modules-local-by-default'; import { ExtractImportsOptions } from 'postcss-modules-extract-imports'; import { ScopeOptions } from 'postcss-modules-scope'; /** Options for [CSS Modules](https://github.com/css-modules/css-modules) */ declare type ModulesOptions = { /** * Default mode for classes * @default "local" * */ mode?: LocalByDefaultOptions["mode"]; /** Fail on wrong order of composition */ failOnWrongOrder?: ExtractImportsOptions["failOnWrongOrder"]; /** Export global classes */ exportGlobals?: ScopeOptions["exportGlobals"]; /** * Placeholder or function for scoped name generation. * Allowed blocks for placeholder: * - `[dir]`: The directory name of the asset. * - `[name]`: The file name of the asset excluding any extension. * - `[local]`: The original value of the selector. * - `[hash(:<num>)]`: A hash based on the name and content of the asset (with optional length). * @default "[name]_[local]__[hash:8]" * */ generateScopedName?: string | ScopeOptions["generateScopedName"]; /** Function for resulting replacements extraction */ getReplacements?: (file: string, replacements: { [k: string]: string; }, out?: string) => void; }; /** File resolved by URL resolver */ declare type ResolvedFile = { from: string; source: Uint8Array; }; /** URL resolver */ declare type Resolve = (url: string, basedir: string) => Promise<ResolvedFile>; /** URL handler options */ declare type UrlOptions = { /** * Inline files instead of copying * @default false */ inline?: boolean; /** * Public Path for URLs in CSS files * @default "./" * */ publicPath?: string; /** * Directory path for outputted CSS assets, * which is not included into resulting URL * @default "." * */ assetDir?: string; /** * Enable/disable name generation with hash for outputted CSS assets * or provide your own placeholder with the following blocks: * - `[extname]`: The file extension of the asset including a leading dot, e.g. `.png`. * - `[ext]`: The file extension without a leading dot, e.g. `png`. * - `[hash(:<num>)]`: A hash based on the name and content of the asset (with optional length). * - `[name]`: The file name of the asset excluding any extension. * Forward slashes / can be used to place files in sub-directories. * @default "assets/[name]-[hash][extname]" ("assets/[name][extname]" if `false`) * */ hash?: boolean | string; /** * Provide custom resolver for URLs * in place of the default one */ resolve?: Resolve; /** * Aliases for URL paths. * Overrides the global `alias` option. * - ex.: `{"foo":"bar"}` */ alias?: { [from: string]: string; }; }; /** File resolved by `@import` resolver */ declare type ResolvedFile$1 = { from: string; source: Uint8Array; }; /** `@import` resolver */ declare type Resolve$1 = (url: string, basedir: string, extensions: string[]) => Promise<ResolvedFile$1>; /** `@import` handler options */ declare type ImportOptions = { /** * Provide custom resolver for imports * in place of the default one */ resolve?: Resolve$1; /** * Aliases for import paths. * Overrides the global `alias` option. * - ex.: `{"foo":"bar"}` */ alias?: { [from: string]: string; }; }; /** Object, which properties are unknown */ declare type ObjectWithUnknownProps = { [prop: string]: unknown; }; /** `postcss-load-config`'s options */ declare type PostCSSLoadConfigOptions = { /** * Path to PostCSS config file directory * @default undefined */ path?: string; /** * Context object passed to PostCSS config file * @default {} */ ctx?: ObjectWithUnknownProps; }; /** Options for Sass Loader */ declare type SASSLoaderOptions = { /** * Sass importer, or array of such * @default undefined */ importer?: Importer | Importer[]; /** * Data to prepend to every Sass file * @default undefined */ data?: string; /** Force Sass implementation */ impl?: "node-sass" | "sass"; /** Forcefully disable/enable `fibers` */ fibers?: boolean; /** Any options for `sass` processor */ [option: string]: unknown; }; /** Options for Stylus loader */ declare type StylusLoaderOptions = { /** Any options for `stylus` processor */ [option: string]: unknown; }; /** Options for Less Loader */ declare type LESSLoaderOptions = { /** * Array of Less plugins * @default undefined */ plugins?: Plugin[]; /** Any options for `less` processor */ [option: string]: unknown; }; /** * Loader * @param LoaderOptionsType type of loader's options * */ declare type Loader<TLoaderOptions = ObjectWithUnknownProps> = { /** Name */ name: string; /** * Test to decide if file should be processed. * Also used for plugin's supported files test. * */ test?: RegExp | ((filepath: string) => boolean); /** Skip testing, always process the file */ alwaysProcess?: boolean; /** Function for processing */ process: (this: LoaderContext<TLoaderOptions>, payload: Payload) => Promise<Payload> | Payload; }; /** * Loader's context * @param LoaderOptionsType type of loader's options * */ declare type LoaderContext<TLoaderOptions = ObjectWithUnknownProps> = { /** * Loader's options * @default {} * */ readonly options: TLoaderOptions; /** @see {@link Options.sourceMap} */ readonly sourceMap?: boolean | "inline"; /** Resource path */ readonly id: string; /** Files to watch */ readonly deps: Set<string>; /** Assets to emit */ readonly assets: Map<string, Uint8Array>; /** Function for emitting a waring */ readonly warn: PluginContext["warn"]; /** https://rollupjs.org/guide/en#plugin-context */ readonly plugin: PluginContext; }; /** Loader's payload */ declare type Payload = { /** File content */ code: string; /** Sourcemap */ map?: string; /** Extracted data */ extracted?: { /** Source file path */ id: string; /** CSS */ css: string; /** Sourcemap */ map?: string; }; }; /** CSS data, extracted from JS */ declare type ExtractedData = { /** CSS */ css: string; /** Sourcemap */ map?: string; /** Output name for CSS */ name: string; }; /** Options for CSS injection */ declare type InjectOptions = { /** * Insert `<style>` tag into container as a first child * @default false * */ prepend?: boolean; /** * Inject CSS into single `<style>` tag only * @default false * */ singleTag?: boolean; /** * Container for `<style>` tag(s) injection * @default "head" * */ container?: string; }; /** `rollup-plugin-styles`'s full option list */ interface Options { /** * Files to include for processing. * @default undefined * */ include?: Parameters<CreateFilter>[0]; /** * Files to exclude from processing. * @default undefined * */ exclude?: Parameters<CreateFilter>[1]; /** * PostCSS will process files ending with these extensions. * @default [".css", ".pcss", ".postcss", ".sss"] * */ extensions?: string[]; /** * A list of plugins for PostCSS, * which are used before plugins loaded from PostCSS config file, if any * @default undefined * */ plugins?: (postcss.Transformer | string | [string] | [string, ObjectWithUnknownProps] | null | undefined)[]; /** * Select mode for this plugin * - `"inject"` *(default)* - Embeds CSS inside JS and injects it into `<head>` at runtime. * You can also pass options for CSS injection. * Alternatively, you can pass your own CSS injector. * - `"extract"` - Extract CSS to the same location where JS file is generated but with .css extension. * You can also set extraction path manually, * relative to output dir/output file's basedir, * but not outside of it. * - `"emit"` - Emit pure processed CSS for other plugins in the build pipeline. * Useful when you only need to preprocess CSS. * @default "inject" * */ mode?: "inject" | ["inject", InjectOptions | ((varname: string, id: string) => string)] | "extract" | ["extract", string] | "emit" | ["emit"]; /** * `to` option for PostCSS, required for some plugins * */ to?: string; /** * Enable/disable or pass options for CSS `@import` resolver * @default true * */ import?: ImportOptions | boolean; /** * Enable/disable or pass options for CSS URL resolver * @default true * */ url?: UrlOptions | boolean; /** * Aliases for URL and import paths. * - ex.: `{"foo":"bar"}` */ alias?: { [from: string]: string; }; /** * Enable and optionally pass additional configuration for * [CSS Modules](https://github.com/css-modules/css-modules) * @default false * */ modules?: boolean | ModulesOptions; /** * Automatically enable * [CSS Modules](https://github.com/css-modules/css-modules) * for files named `[name].module.[ext]` * (e.g. `foo.module.css`, `bar.module.stylus`), * or pass your own function or regular expression * @default false * */ autoModules?: boolean | RegExp | ((id: string) => boolean); /** * Use named exports alongside default export. * You can supply a function to control how exported name is generated. * @default false * */ namedExports?: boolean | ((name: string) => string); /** * Enable CSS minification and optionally pass additional configuration for * [cssnano](https://github.com/cssnano/cssnano) * @default false * */ minimize?: boolean | cssnano.CssNanoOptions; /** * Enable sourcemaps. * @default false * */ sourceMap?: boolean | "inline"; /** * Set PostCSS parser, e.g. `sugarss`. * Overrides the one loaded from PostCSS config file, if any * @default undefined * */ parser?: string | postcss.Parser; /** * Set PostCSS stringifier. * Overrides the one loaded from PostCSS config file, if any * @default undefined * */ stringifier?: string | postcss.Stringifier; /** * Set PostCSS syntax. * Overrides the one loaded from PostCSS config file, if any * @default undefined * */ syntax?: string | postcss.Syntax; /** * Enable loading PostCSS config file. * @default true * */ config?: boolean | PostCSSLoadConfigOptions; /** * Array of loaders to use, executed from right to left. * Currently built-in loaders are: * - `sass` (Supports `.scss` and `.sass` files) * - `stylus` (Supports `.styl` and `.stylus` files) * - `less` (Supports `.less` files) * @default ["sass", "stylus", "less"] * */ use?: string[]; /** Options for Sass loader */ sass?: SASSLoaderOptions; /** Options for Stylus loader */ stylus?: StylusLoaderOptions; /** Options for Less loader */ less?: LESSLoaderOptions; /** * Array of custom loaders. * @default undefined * */ loaders?: Loader[]; /** * Function which is invoked on CSS file import. * @default undefined * */ onImport?: (code: string, id: string) => void; /** * Function which is invoked on CSS file import. * Return `boolean` to decide if you want to extract the file or not. * @default undefined * */ onExtract?: (fn: (name: string, ids: string[]) => ExtractedData) => boolean; } declare const _default: (options?: Options) => Plugin$1; export default _default;