Skip to content

Commit

Permalink
Browse files Browse the repository at this point in the history
feat: allow filtering urls (#856)
  • Loading branch information
evilebottnawi committed Dec 6, 2018
1 parent 9642aa5 commit 5e702e7
Show file tree
Hide file tree
Showing 8 changed files with 383 additions and 30 deletions.
71 changes: 49 additions & 22 deletions README.md
Expand Up @@ -114,23 +114,41 @@ module.exports = {

## Options

| Name | Type | Default | Description |
| :-----------------------------------------: | :-----------------: | :-------------: | :------------------------------------------ |
| **[`url`](#url)** | `{Boolean}` | `true` | Enable/Disable `url()` handling |
| **[`import`](#import)** | `{Boolean}` | `true` | Enable/Disable @import handling |
| **[`modules`](#modules)** | `{Boolean\|String}` | `false` | Enable/Disable CSS Modules and setup mode |
| **[`localIdentName`](#localidentname)** | `{String}` | `[hash:base64]` | Configure the generated ident |
| **[`sourceMap`](#sourcemap)** | `{Boolean}` | `false` | Enable/Disable Sourcemaps |
| **[`camelCase`](#camelcase)** | `{Boolean\|String}` | `false` | Export Classnames in CamelCase |
| **[`importLoaders`](#importloaders)** | `{Number}` | `0` | Number of loaders applied before CSS loader |
| **[`exportOnlyLocals`](#exportonlylocals)** | `{Boolean}` | `false` | Export only locals |
| Name | Type | Default | Description |
| :-----------------------------------------: | :-------------------: | :-------------: | :------------------------------------------ |
| **[`url`](#url)** | `{Boolean\|Function}` | `true` | Enable/Disable `url()` handling |
| **[`import`](#import)** | `{Boolean}` | `true` | Enable/Disable @import handling |
| **[`modules`](#modules)** | `{Boolean\|String}` | `false` | Enable/Disable CSS Modules and setup mode |
| **[`localIdentName`](#localidentname)** | `{String}` | `[hash:base64]` | Configure the generated ident |
| **[`sourceMap`](#sourcemap)** | `{Boolean}` | `false` | Enable/Disable Sourcemaps |
| **[`camelCase`](#camelcase)** | `{Boolean\|String}` | `false` | Export Classnames in CamelCase |
| **[`importLoaders`](#importloaders)** | `{Number}` | `0` | Number of loaders applied before CSS loader |
| **[`exportOnlyLocals`](#exportonlylocals)** | `{Boolean}` | `false` | Export only locals |

### `url`

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

Enable/disable `url()` resolving. Absolute `urls` are not resolving by default.
Control `url()` resolving. Absolute `urls` are not resolving by default.

Examples resolutions:

```
url(image.png) => require('./image.png')
url(./image.png) => require('./image.png')
```

To import assets from a `node_modules` path (include `resolve.modules`) and for `alias`, prefix it with a `~`:

```
url(~module/image.png) => require('module/image.png')
url(~aliasDirectory/image.png) => require('otherDirectory/image.png')
```

#### `Boolean`

Enable/disable `url()` resolving.

**webpack.config.js**

Expand All @@ -150,18 +168,27 @@ module.exports = {
};
```

Examples resolutions:
#### `Function`

```
url(image.png) => require('./image.png')
url(./image.png) => require('./image.png')
```

To import assets from a `node_modules` path (include `resolve.modules`) and for `alias`, prefix it with a `~`:
Allow to filter `url()`. All filtered `url()` will not be resolved.

```
url(~module/image.png) => require('module/image.png')
url(~aliasDirectory/image.png) => require('otherDirectory/image.png')
```js
module.exports = {
module: {
rules: [
{
test: /\.css$/,
loader: 'css-loader',
options: {
url: (url, resourcePath) => {
// `url()` with `img.png` stay untouched
return url.includes('img.png');
},
},
},
],
},
};
```

### `import`
Expand Down
12 changes: 6 additions & 6 deletions src/index.js
Expand Up @@ -26,6 +26,7 @@ import {
getImportPrefix,
placholderRegExps,
dashesCamelCase,
getFilter,
} from './utils';
import Warning from './Warning';
import CssSyntaxError from './CssSyntaxError';
Expand Down Expand Up @@ -66,9 +67,6 @@ export default function loader(content, map, meta) {
}
}

const resolveImport = options.import !== false;
const resolveUrl = options.url !== false;

const plugins = [];

if (options.modules) {
Expand Down Expand Up @@ -100,14 +98,16 @@ export default function loader(content, map, meta) {
);
}

if (resolveImport) {
if (options.import !== false) {
plugins.push(importParser());
}

if (resolveUrl) {
if (options.url !== false) {
plugins.push(
urlParser({
filter: (value) => isUrlRequest(value),
filter: getFilter(options.url, this.resourcePath, (value) =>
isUrlRequest(value)
),
})
);
}
Expand Down
9 changes: 8 additions & 1 deletion src/options.json
Expand Up @@ -2,7 +2,14 @@
"additionalProperties": false,
"properties": {
"url": {
"type": "boolean"
"anyOf": [
{
"type": "boolean"
},
{
"instanceof": "Function"
}
]
},
"import": {
"type": "boolean"
Expand Down
22 changes: 21 additions & 1 deletion src/utils.js
Expand Up @@ -61,4 +61,24 @@ function getLocalIdent(loaderContext, localIdentName, localName, options) {
.replace(/^((-?[0-9])|--)/, '_$1');
}

export { getImportPrefix, getLocalIdent, placholderRegExps, dashesCamelCase };
function getFilter(filter, resourcePath, defaultFilter = null) {
return (content) => {
if (defaultFilter && !defaultFilter(content)) {
return false;
}

if (typeof filter === 'function') {
return !filter(content, resourcePath);
}

return true;
};
}

export {
getImportPrefix,
getLocalIdent,
placholderRegExps,
dashesCamelCase,
getFilter,
};
2 changes: 2 additions & 0 deletions test/__snapshots__/errors.test.js.snap
Expand Up @@ -4,6 +4,8 @@ exports[`validation 1`] = `
"CSS Loader Invalid Options
options.url should be boolean
options.url should pass \\"instanceof\\" keyword validation
options.url should match some schema in anyOf
"
`;

Expand Down

0 comments on commit 5e702e7

Please sign in to comment.