Skip to content

Commit

Permalink
feat: improved validation error messages
Browse files Browse the repository at this point in the history
  • Loading branch information
evilebottnawi authored Jul 17, 2019
1 parent 9c32885 commit 65e4fc0
Show file tree
Hide file tree
Showing 9 changed files with 1,175 additions and 840 deletions.
8 changes: 8 additions & 0 deletions .github/CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -147,6 +147,14 @@ module. Thankfully, Github provides a means to do this. Add a dependency to the

Where `{id}` is the # ID of your Pull Request.

## Contributor License Agreement

When submitting your contribution, a CLA (Contributor License Agreement) bot will come by to verify that you signed the [CLA](https://cla.js.foundation/webpack-contrib/css-loader).
If it is your first time, it will link you to the right place to sign it.
However, if you have committed your contributions using an email that is not the same as your email used on GitHub, the CLA bot can't accept your contribution.

Run `git config user.email` to see your Git email, and verify it with [your GitHub email](https://github.com/settings/emails).

## Thanks

For your interest, time, understanding, and for following this simple guide.
41 changes: 26 additions & 15 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -109,21 +109,22 @@ module.exports = {

## Options

| Name | Type | Default | Description |
| :-----------------------------------------: | :-------------------------: | :-----: | :------------------------------------------------- |
| **[`url`](#url)** | `{Boolean\|Function}` | `true` | Enable/Disable `url()` handling |
| **[`import`](#import)** | `{Boolean\|Function}` | `true` | Enable/Disable @import handling |
| **[`modules`](#modules)** | `{Boolean\|String\|Object}` | `false` | Enable/Disable CSS Modules and setup their options |
| **[`sourceMap`](#sourcemap)** | `{Boolean}` | `false` | Enable/Disable Sourcemaps |
| **[`importLoaders`](#importloaders)** | `{Number}` | `0` | Number of loaders applied before CSS loader |
| **[`localsConvention`](#localsconvention)** | `{String}` | `asIs` | Setup style of exported classnames |
| **[`onlyLocals`](#onlylocals)** | `{Boolean}` | `false` | Export only locals |
| Name | Type | Default | Description |
| :-----------------------------------------: | :-------------------------: | :-----: | :--------------------------------------------------------------------- |
| **[`url`](#url)** | `{Boolean\|Function}` | `true` | Enables/Disables `url`/`image-set` functions handling |
| **[`import`](#import)** | `{Boolean\|Function}` | `true` | Enables/Disables `@import` at-rules handling |
| **[`modules`](#modules)** | `{Boolean\|String\|Object}` | `false` | Enables/Disables CSS Modules and their configuration |
| **[`sourceMap`](#sourcemap)** | `{Boolean}` | `false` | Enables/Disables generation of source maps |
| **[`importLoaders`](#importloaders)** | `{Number}` | `0` | Enables/Disables or setups number of loaders applied before CSS loader |
| **[`localsConvention`](#localsconvention)** | `{String}` | `asIs` | Style of exported classnames |
| **[`onlyLocals`](#onlylocals)** | `{Boolean}` | `false` | Export only locals |

### `url`

Type: `Boolean|Function`
Default: `true`

Enables/Disables `url`/`image-set` functions handling.
Control `url()` resolving. Absolute URLs and root-relative URLs are not resolving.

Examples resolutions:
Expand Down Expand Up @@ -203,6 +204,7 @@ module.exports = {
Type: `Boolean`
Default: `true`

Enables/Disables `@import` at-rules handling.
Control `@import` resolving. Absolute urls in `@import` will be moved in runtime code.

Examples resolutions:
Expand Down Expand Up @@ -285,6 +287,8 @@ module.exports = {
Type: `Boolean|String|Object`
Default: `false`

Enables/Disables CSS Modules and their configuration.

The `modules` option enables/disables the **[CSS Modules](https://github.com/css-modules/css-modules)** specification and setup basic behaviour.

Using `false` value increase performance because we avoid parsing **CSS Modules** features, it will be useful for developers who use vanilla css or use other technologies.
Expand Down Expand Up @@ -703,14 +707,12 @@ module.exports = {
Type: `Boolean`
Default: `false`

To include source maps set the `sourceMap` option.
Enables/Disables generation of source maps.

I.e. the `mini-css-extract-plugin` can handle them.
To include source maps set the `sourceMap` option.

They are not enabled by default because they expose a runtime overhead and increase in bundle size (JS source maps do not).

In addition to that relative paths are buggy and you need to use an absolute public path which includes the server URL.

**webpack.config.js**

```js
Expand All @@ -734,6 +736,8 @@ module.exports = {
Type: `Number`
Default: `0`

Enables/Disables or setups number of loaders applied before CSS loader.

The option `importLoaders` allows you to configure how many loaders before `css-loader` should be applied to `@import`ed resources.

**webpack.config.js**
Expand All @@ -749,7 +753,10 @@ module.exports = {
{
loader: 'css-loader',
options: {
importLoaders: 2, // 0 => no loaders (default); 1 => postcss-loader; 2 => postcss-loader, sass-loader
importLoaders: 2,
// 0 => no loaders (default);
// 1 => postcss-loader;
// 2 => postcss-loader, sass-loader
},
},
'postcss-loader',
Expand All @@ -768,6 +775,8 @@ This may change in the future when the module system (i. e. webpack) supports lo
Type: `String`
Default: `undefined`

Style of exported classnames.

By default, the exported JSON keys mirror the class names (i.e `asIs` value).

| Name | Type | Description |
Expand Down Expand Up @@ -814,7 +823,9 @@ module.exports = {
Type: `Boolean`
Default: `false`

Export only locals (**useful** when you use **css modules**).
Export only locals.

**Useful** when you use **css modules** for pre-rendering (for example SSR).
For pre-rendering with `mini-css-extract-plugin` you should use this option instead of `style-loader!css-loader` **in the pre-rendering bundle**.
It doesn't embed CSS but only exports the identifier mappings.

Expand Down
7 changes: 2 additions & 5 deletions lint-staged.config.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,4 @@
module.exports = {
ignore: ['package-lock.json', 'CHANGELOG.md'],
linters: {
'*.js': ['prettier --write', 'eslint --fix', 'git add'],
'*.{json,md,yml,css}': ['prettier --write', 'git add'],
},
'*.js': ['prettier --write', 'eslint --fix', 'git add'],
'*.{json,md,yml,css}': ['prettier --write', 'git add'],
};
Loading

0 comments on commit 65e4fc0

Please sign in to comment.