css-loader

(★ 4,320)

CSS Loader

Owner Repos

webpack ★ 65,971

A bundler for javascript and friends. Packs many modules into a few bundled assets. Code Splitting allows for loading parts of the application on demand. Through "loaders", modules can be CommonJs, AMD, ES6 modules, CSS, Images, JSON, Coffeescript, LESS, ... and your custom stuff.

JavaScript
webpack-bundle-analyzer ★ 12,660

Webpack plugin and CLI utility that represents bundle content as convenient interactive zoomable treemap

JavaScript
webpack-dev-server ★ 7,848

Serves a webpack app. Updates the browser on changes. Documentation https://webpack.js.org/configuration/dev-server/.

JavaScript
mini-css-extract-plugin ★ 4,663

Lightweight CSS extraction plugin

JavaScript
sass-loader ★ 3,892

Compiles Sass to CSS

JavaScript
tapable ★ 3,862

Just a little module for plugins.

JavaScript

File Explorer

ZIP Download
  • .cspell.json
  • .editorconfig
  • .eslintignore
  • .eslintrc.js
  • .gitattributes
  • .gitignore
  • .prettierignore
  • babel.config.js
  • CHANGELOG.md
  • commitlint.config.js
  • jest.config.js
  • LICENSE
  • lint-staged.config.js
  • package-lock.json
  • package.json
  • README.md

# Installation Guide

node
Prerequisites

Setup Steps

npm install

Install project dependencies.

npm test

Run tests to verify dependencies and source code.

Key Commands

npm install

Install project dependencies defined in package.json.

npm test

Run the test suite based on Jest.

webpack@5 is required to use the latest version of css-loader.

# Use via CDN

jsDelivr

jsDelivr serves any public GitHub repository as a CDN with zero setup. Pick a version and a file to get a ready-to-paste link and snippet.

Link
Example

Command Glossary

Commands referenced in this DOCs, explained below.

🔍

edit

View Details ▼

A terminal-based text editor from Microsoft.

edit {{path/to/file}}

Open a file:

tldr run-mailcap

View documentation for the original command:

<Ctrl f>{{pattern}}<Enter>

Search for a pattern:

🔍

eval

View Details ▼

Execute arguments as a single command in the current shell and return its result.

eval "{{echo foo}}"

Call `echo` with the "foo" argument:

eval "{{foo=bar}}"

Set a variable in the current shell:

🔍

npm install

View Details ▼

Install Node packages.

npm {{[i|install]}}

Install dependencies listed in `package.json`:

npm {{[i|install]}} {{package_name}}@{{version}}

Download a specific version of a package and add it to the list of dependencies in `package.json`:

npm {{[i|install]}} {{package_name}} {{[-D|--save-dev]}}

Download the latest version of a package and add it to the list of dev dependencies in `package.json`:

🔍

pnpm

View Details ▼

Fast, disk space efficient package manager for Node.js.
Manage Node.js projects and their module dependencies.

pnpm init

Create a `package.json` file:

pnpm {{[i|install]}}

Download all the packages listed as dependencies in `package.json`:

pnpm add {{module_name}}@{{version}}

Download a specific version of a package and add it to the list of dependencies in `package.json`:

🔍

webpack

View Details ▼

Bundle a web project's js files and other assets into a single output file.

webpack {{app.js}} {{bundle.js}}

Create a single output file from an entry point file:

webpack {{app.js}} {{bundle.js}} --module-bind '{{css=css}}'

Load CSS files too from the JavaScript file (this uses the CSS loader for CSS files):

webpack {{[-c|--config]}} {{webpack.config.js}} --progress

Pass a configuration file (with e.g. the entry script and the output filename) and show compilation progress:

🔍

yarn

View Details ▼

JavaScript and Node.js package manager alternative.

yarn global add {{module_name}}

Install a module globally:

yarn install

Install all dependencies referenced in the `package.json` file (the `install` is optional):

yarn add {{module_name}}@{{version}}

Install a module and save it as a dependency to the `package.json` file (add `--dev` to save as a dev dependency):

// repository documentation