JSPM

neutrino-middleware-styles-loader

0.0.1
  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 5
  • Score
    100M100P100Q30601F
  • License MIT

Neutrino middleware for loading and importing all kinds of stylesheets from modules

Package Exports

  • neutrino-middleware-styles-loader

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (neutrino-middleware-styles-loader) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

neutrino-middleware-styles-loader

NPM version NPM downloads CircleCI

neutrino-middleware-styles-loader is Neutrino middleware for loading and importing all kinds of stylesheets from modules

fork from poi

Features

  • Support all kinds of stylesheets: css, stylus, styl, sass, scss, less
  • Easy config minimize, extractCSS, sourceMap as out-of-the-box feature
  • Support css modules
  • Customizing postcss and autoprefixer

Requirements

  • Node.js v6.10+
  • Yarn or npm client
  • Neutrino v6

Installation

# yarn
$ yarn add neutrino-middleware-styles-loader
# npm
$ npm install --save neutrino-middleware-styles-loader

Usage

Note: If you want to use one of these stylus, styl, sass, scss, less, you should install the loader by yourself. After install less-loader and less, you can use *.less now.

neutrino-middleware-styles-loader can be consumed from the Neutrino API, middleware, or presets. Require this package and plug it into Neutrino:

// Using function middleware format
const styles = require('neutrino-middleware-styles-loader')

// Use with default options
neutrino.use(styles)

// Usage showing default options
neutrino.use(styles, {
  minimize: false,
  extractCSS: false,
  sourceMap: false,
  postcss: {},
  cssModules: false,
  autoprefixer: false
})
// Using object or array middleware format

// Use with default options
module.exports = {
  use: ['neutrino-middleware-styles-loader']
}

// Usage showing default options
module.exports = {
  use: [
    ['neutrino-middleware-styles-loader', {
      minimize: false,
      extractCSS: false,
      sourceMap: false,
      postcss: {},
      cssModules: false,
      autoprefixer: false
    }]
  ]
}

Options

This lib using webpack-handle-css-loader create config.

autoprefixer

Type: object boolean

Default:

{
  browsers: ['ie > 8', 'last 4 versions']
}

Options for autoprefixer, set to false to disable it.

cssModules

Type: boolean Default: false

Process CSS using css modules.

Files ending with .module.css .module.scss .module.less etc also support CSS modules by default.

To enable CSS modules for all CSS files, set cssModules: true in config file.

extractCSS

Type: boolean Default: false

Extract CSS into a single file.

minimize

Type: boolean

Default: false

Minimize CSS files.

sourceMap

Type: boolean

Default: false

Generate sourcemaps.

Note: If you want to use this, set sourceMap: true, and you also should set config.devtool option.

postcss

Type: Array object

If you're using CLI, it searches for custom postcss config file using postcss-load-config, and add autoprefixer to the top of it when postcss is an array or object.

You can use this option to override it if you don't want extra config file for postcss.

Contributing

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Commit your changes: git commit -am 'Add some feature'
  4. Push to the branch: git push origin my-new-feature
  5. Submit a pull request :D

Author

neutrino-middleware-styles-loader © zcong1993, Released under the MIT License.
Authored and maintained by zcong1993 with help from contributors (list).

github.com/zcong1993 · GitHub @zcong1993