1. postcss-easy-import
PostCSS plugin to inline @import rules content with extra features
postcss-easy-import
Package: postcss-easy-import
Created by: TrySound
Last modified: Fri, 24 Jun 2022 09:51:41 GMT
Version: 4.0.0
License: MIT
Downloads: 116,641
Repository: https://github.com/TrySound/postcss-easy-import

Install

npm install postcss-easy-import
yarn add postcss-easy-import

postcss-easy-import Build Status

PostCSS plugin to inline @import rules content with extra features.

Usage

 postcss([ require('postcss-easy-import') ])

See PostCSS docs for examples for your environment.

Resolving files with globs

The path to the file will be checked and if it contains a glob it will be used
to locate it. These can be mixed and matched with normal module paths:

 @import "suitcss-utils-display"; /* node_modules */
@import "./theme.css"; /* relative path */
@import "./components/*.css"; /* glob */
@import "suitcss-utils-size/lib/*.css"; /* glob inside node_modules */

Options

This plugin is a postcss-import extension which introduces its own resolve option.

prefix

Type: false or string
Default: false

Allows partial-like importing with a prefix before the filename.

 @import 'modules/partial.css';
/* will import modules/_partial.css */

Prefixed versions are always favoured. Otherwise the non-prefix version is used:

├── _baz.css
├── baz.css
├── bar.css

The matched files would be ['_baz.css', 'bar.css'].

extensions

Type: array or string
Default: .css

Defines file extensions which will be looked for.

License

MIT © Bogdan Chadkin

RELATED POST

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Enhancing Vue.js Development: Harnessing the Potential of Vue-Loader

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Simplify Data Validation in Vue.js: A Step-by-Step Guide to Using Regex

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Troubleshooting Made Easy: Common Issues and Solutions with vue-loader Without vue-cli

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Optimizing Webpack 4 with Vue CLI 3: Disabling the Cache-Loader

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin

Step-by-Step Guide: How to Add a Function to Your Vuex Plugin