Skip to content
This repository has been archived by the owner on Mar 17, 2021. It is now read-only.

Commit

Permalink
feat: limit option can be boolean (#181)
Browse files Browse the repository at this point in the history
  • Loading branch information
evilebottnawi committed Jun 5, 2019
1 parent d82e453 commit 60d2cb3
Show file tree
Hide file tree
Showing 7 changed files with 89 additions and 34 deletions.
23 changes: 20 additions & 3 deletions README.md
Expand Up @@ -91,16 +91,18 @@ For example, to set the quality option of a responsive-loader above use:

### `limit`

Type: `Number`
Type: `Number|Boolean`
Default: `undefined`

The limit can be specified via loader options and defaults to no limit.

#### `Number`

A `Number` specifying the maximum size of a file in bytes. If the file size is
**equal** or **greater** than the limit [`file-loader`](https://github.com/webpack-contrib/file-loader)
will be used (by default) and all query parameters are passed to it.
Using an alternative to `file-loader` is enabled via the `fallback` option.

The limit can be specified via loader options and defaults to no limit.

```js
// webpack.config.js
{
Expand All @@ -111,6 +113,21 @@ The limit can be specified via loader options and defaults to no limit.
}
```

#### `Boolean`

Enable or disable transform files into base64.

```js
// webpack.config.js
{
loader: 'url-loader',
options: {
// Disable transformation to base64
limit: false
}
}
```

### `mimetype`

Type: `String`
Expand Down
17 changes: 13 additions & 4 deletions src/index.js
Expand Up @@ -11,17 +11,26 @@ import mime from 'mime';
import normalizeFallback from './utils/normalizeFallback';
import schema from './options.json';

function shouldTransform(limit, size) {
if (typeof limit === 'boolean') {
return limit;
}

if (typeof limit === 'number') {
return size <= parseInt(limit, 10);
}

return true;
}

export default function loader(src) {
// Loader Options
const options = getOptions(this) || {};

validateOptions(schema, options, 'URL Loader');

// Set limit for resource inlining (file size)
const limit = options.limit ? parseInt(options.limit, 10) : options.limit;

// No limit or within the specified limit
if ((!limit && typeof limit !== 'number') || src.length <= limit) {
if (shouldTransform(options.limit, src.length)) {
const file = this.resourcePath;
// Get MIME type
const mimetype = options.mimetype || mime.getType(file);
Expand Down
2 changes: 1 addition & 1 deletion src/options.json
Expand Up @@ -2,7 +2,7 @@
"type": "object",
"properties": {
"limit": {
"type": ["number"]
"type": ["boolean", "number"]
},
"mimetype": {
"type": "string"
Expand Down
20 changes: 12 additions & 8 deletions test/__snapshots__/limit-option.test.js.snap

Large diffs are not rendered by default.

11 changes: 2 additions & 9 deletions test/__snapshots__/validate-options.test.js.snap
Expand Up @@ -3,25 +3,18 @@
exports[`validation 1`] = `
"URL Loader Invalid Options
options.limit should be number
options.limit should be boolean,number
"
`;

exports[`validation 2`] = `
"URL Loader Invalid Options
options.limit should be number
"
`;

exports[`validation 3`] = `
"URL Loader Invalid Options
options.mimetype should be string
"
`;

exports[`validation 4`] = `
exports[`validation 3`] = `
"URL Loader Invalid Options
options.fallback should be string
Expand Down
48 changes: 40 additions & 8 deletions test/limit-option.test.js
@@ -1,7 +1,7 @@
import webpack from './helpers/compiler';

describe('limit option', () => {
it('{undefined}', async () => {
it('not specify', async () => {
const config = {
loader: {
test: /\.png$/,
Expand All @@ -15,7 +15,7 @@ describe('limit option', () => {
expect(source).toMatchSnapshot();
});

it('{Number} (0)', async () => {
it('0 ({Number})', async () => {
// Image size is 6777
const config = {
loader: {
Expand All @@ -32,7 +32,7 @@ describe('limit option', () => {
expect(source).toMatchSnapshot();
});

it('{Number} (0.1)', async () => {
it('0.1 ({Number})', async () => {
// Image size is 6777
const config = {
loader: {
Expand All @@ -49,7 +49,7 @@ describe('limit option', () => {
expect(source).toMatchSnapshot();
});

it('{Number} (6776)', async () => {
it('6776 ({Number})', async () => {
// Image size is 6777
const config = {
loader: {
Expand All @@ -66,7 +66,7 @@ describe('limit option', () => {
expect(source).toMatchSnapshot();
});

it('{Number} (6777)', async () => {
it('6777 ({Number})', async () => {
// Image size is 6777
const config = {
loader: {
Expand All @@ -83,7 +83,7 @@ describe('limit option', () => {
expect(source).toMatchSnapshot();
});

it('{Number} (6778)', async () => {
it('6778 ({Number})', async () => {
// Image size is 6777
const config = {
loader: {
Expand All @@ -100,7 +100,7 @@ describe('limit option', () => {
expect(source).toMatchSnapshot();
});

it('{Number} (Number.MAX_SAFE_INTEGER)', async () => {
it('Number.MAX_SAFE_INTEGER ({Number})', async () => {
const config = {
loader: {
test: /\.png$/,
Expand All @@ -116,7 +116,7 @@ describe('limit option', () => {
expect(source).toMatchSnapshot();
});

it('{Number} (Number.MIN_SAFE_INTEGER)', async () => {
it('Number.MIN_SAFE_INTEGER ({Number})', async () => {
const config = {
loader: {
test: /\.png$/,
Expand All @@ -131,4 +131,36 @@ describe('limit option', () => {

expect(source).toMatchSnapshot();
});

it('true ({Boolean})', async () => {
const config = {
loader: {
test: /\.png$/,
options: {
limit: true,
},
},
};

const stats = await webpack('fixture.js', config);
const [{ source }] = stats.toJson().modules;

expect(source).toMatchSnapshot();
});

it('false ({Boolean})', async () => {
const config = {
loader: {
test: /\.png$/,
options: {
limit: false,
},
},
};

const stats = await webpack('fixture.js', config);
const [{ source }] = stats.toJson().modules;

expect(source).toMatchSnapshot();
});
});
2 changes: 1 addition & 1 deletion test/validate-options.test.js
Expand Up @@ -18,8 +18,8 @@ it('validation', async () => {
expect(() => validate({ unknown: 'unknown' })).not.toThrow();

expect(() => validate({ limit: 8192 })).not.toThrow();
expect(() => validate({ limit: true })).not.toThrow();
expect(() => validate({ limit: '8192' })).toThrowErrorMatchingSnapshot();
expect(() => validate({ limit: true })).toThrowErrorMatchingSnapshot();

expect(() => validate({ mimetype: 'image/png' })).not.toThrow();
expect(() => validate({ mimetype: true })).toThrowErrorMatchingSnapshot();
Expand Down

0 comments on commit 60d2cb3

Please sign in to comment.