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

Commit d699243

Browse files
alanyinjsevilebottnawi
alanyinjs
authored and
evilebottnawi
committed
docs(readme): updated single loader syntax (#316)
1 parent 5545075 commit d699243

File tree

1 file changed

+124
-76
lines changed

1 file changed

+124
-76
lines changed

‎README.md‎

Lines changed: 124 additions & 76 deletions
Original file line numberDiff line numberDiff line change
@@ -81,10 +81,14 @@ module.exports = {
8181
rules: [
8282
{
8383
test: /\.(png|jpg|gif)$/,
84-
loader: 'file-loader',
85-
options: {
86-
name: '[path][name].[ext]',
87-
},
84+
use: [
85+
{
86+
loader: 'file-loader',
87+
options: {
88+
name: '[path][name].[ext]',
89+
},
90+
},
91+
],
8892
},
8993
],
9094
},
@@ -101,16 +105,20 @@ module.exports = {
101105
rules: [
102106
{
103107
test: /\.(png|jpg|gif)$/,
104-
loader: 'file-loader',
105-
options: {
106-
name(file) {
107-
if (process.env.NODE_ENV === 'development') {
108-
return '[path][name].[ext]';
109-
}
110-
111-
return '[hash].[ext]';
108+
use: [
109+
{
110+
loader: 'file-loader',
111+
options: {
112+
name(file) {
113+
if (process.env.NODE_ENV === 'development') {
114+
return '[path][name].[ext]';
115+
}
116+
117+
return '[hash].[ext]';
118+
},
119+
},
112120
},
113-
},
121+
],
114122
},
115123
],
116124
},
@@ -136,10 +144,14 @@ module.exports = {
136144
rules: [
137145
{
138146
test: /\.(png|jpg|gif)$/,
139-
loader: 'file-loader',
140-
options: {
141-
outputPath: 'images',
142-
},
147+
use: [
148+
{
149+
loader: 'file-loader',
150+
options: {
151+
outputPath: 'images',
152+
},
153+
},
154+
],
143155
},
144156
],
145157
},
@@ -156,26 +168,30 @@ module.exports = {
156168
rules: [
157169
{
158170
test: /\.(png|jpg|gif)$/,
159-
loader: 'file-loader',
160-
options: {
161-
outputPath: (url, resourcePath, context) => {
162-
// `resourcePath` is original absolute path to asset
163-
// `context` is directory where stored asset (`rootContext`) or `context` option
171+
use: [
172+
{
173+
loader: 'file-loader',
174+
options: {
175+
outputPath: (url, resourcePath, context) => {
176+
// `resourcePath` is original absolute path to asset
177+
// `context` is directory where stored asset (`rootContext`) or `context` option
164178

165-
// To get relative path you can use
166-
// const relativePath = path.relative(context, resourcePath);
179+
// To get relative path you can use
180+
// const relativePath = path.relative(context, resourcePath);
167181

168-
if (/my-custom-image\.png/.test(resourcePath)) {
169-
return `other_output_path/${url}`;
170-
}
182+
if (/my-custom-image\.png/.test(resourcePath)) {
183+
return `other_output_path/${url}`;
184+
}
171185

172-
if (/images/.test(context)) {
173-
return `image_output_path/${url}`;
174-
}
186+
if (/images/.test(context)) {
187+
return `image_output_path/${url}`;
188+
}
175189

176-
return `output_path/${url}`;
190+
return `output_path/${url}`;
191+
},
192+
},
177193
},
178-
},
194+
],
179195
},
180196
],
181197
},
@@ -199,10 +215,14 @@ module.exports = {
199215
rules: [
200216
{
201217
test: /\.(png|jpg|gif)$/,
202-
loader: 'file-loader',
203-
options: {
204-
publicPath: 'assets',
205-
},
218+
use: [
219+
{
220+
loader: 'file-loader',
221+
options: {
222+
publicPath: 'assets',
223+
},
224+
},
225+
],
206226
},
207227
],
208228
},
@@ -219,26 +239,30 @@ module.exports = {
219239
rules: [
220240
{
221241
test: /\.(png|jpg|gif)$/,
222-
loader: 'file-loader',
223-
options: {
224-
publicPath: (url, resourcePath, context) => {
225-
// `resourcePath` is original absolute path to asset
226-
// `context` is directory where stored asset (`rootContext`) or `context` option
242+
use: [
243+
{
244+
loader: 'file-loader',
245+
options: {
246+
publicPath: (url, resourcePath, context) => {
247+
// `resourcePath` is original absolute path to asset
248+
// `context` is directory where stored asset (`rootContext`) or `context` option
227249

228-
// To get relative path you can use
229-
// const relativePath = path.relative(context, resourcePath);
250+
// To get relative path you can use
251+
// const relativePath = path.relative(context, resourcePath);
230252

231-
if (/my-custom-image\.png/.test(resourcePath)) {
232-
return `other_public_path/${url}`;
233-
}
253+
if (/my-custom-image\.png/.test(resourcePath)) {
254+
return `other_public_path/${url}`;
255+
}
234256

235-
if (/images/.test(context)) {
236-
return `image_output_path/${url}`;
237-
}
257+
if (/images/.test(context)) {
258+
return `image_output_path/${url}`;
259+
}
238260

239-
return `public_path/${url}`;
261+
return `public_path/${url}`;
262+
},
263+
},
240264
},
241-
},
265+
],
242266
},
243267
],
244268
},
@@ -258,10 +282,14 @@ module.exports = {
258282
rules: [
259283
{
260284
test: /\.(png|jpg|gif)$/,
261-
loader: 'file-loader',
262-
options: {
263-
context: 'project',
264-
},
285+
use: [
286+
{
287+
loader: 'file-loader',
288+
options: {
289+
context: 'project',
290+
},
291+
},
292+
],
265293
},
266294
],
267295
},
@@ -292,10 +320,14 @@ module.exports = {
292320
rules: [
293321
{
294322
test: /\.css$/,
295-
loader: 'file-loader',
296-
options: {
297-
emitFile: false,
298-
},
323+
use: [
324+
{
325+
loader: 'file-loader',
326+
options: {
327+
emitFile: false,
328+
},
329+
},
330+
],
299331
},
300332
],
301333
},
@@ -325,11 +357,15 @@ module.exports = {
325357
rules: [
326358
{
327359
test: /\.(png|jpg|gif)$/,
328-
loader: 'file-loader',
329-
options: {
330-
regExp: /\/([a-z0-9]+)\/[a-z0-9]+\.png$/,
331-
name: '[1]-[name].[ext]',
332-
},
360+
use: [
361+
{
362+
loader: 'file-loader',
363+
options: {
364+
regExp: /\/([a-z0-9]+)\/[a-z0-9]+\.png$/,
365+
name: '[1]-[name].[ext]',
366+
},
367+
},
368+
],
333369
},
334370
],
335371
},
@@ -446,10 +482,14 @@ module.exports = {
446482
rules: [
447483
{
448484
test: /\.(png|jpg|gif)$/,
449-
loader: 'file-loader',
450-
options: {
451-
name: 'dirname/[hash].[ext]',
452-
},
485+
use: [
486+
{
487+
loader: 'file-loader',
488+
options: {
489+
name: 'dirname/[hash].[ext]',
490+
},
491+
}
492+
],
453493
},
454494
],
455495
},
@@ -479,10 +519,14 @@ module.exports = {
479519
rules: [
480520
{
481521
test: /\.(png|jpg|gif)$/,
482-
loader: 'file-loader',
483-
options: {
484-
name: '[sha512:hash:base64:7].[ext]',
485-
},
522+
use: [
523+
{
524+
loader: 'file-loader',
525+
options: {
526+
name: '[sha512:hash:base64:7].[ext]',
527+
},
528+
},
529+
],
486530
},
487531
],
488532
},
@@ -512,10 +556,14 @@ module.exports = {
512556
rules: [
513557
{
514558
test: /\.(png|jpg|gif)$/,
515-
loader: 'file-loader',
516-
options: {
517-
name: '[path][name].[ext]?[hash]',
518-
},
559+
use: [
560+
{
561+
loader: 'file-loader',
562+
options: {
563+
name: '[path][name].[ext]?[hash]',
564+
},
565+
},
566+
],
519567
},
520568
],
521569
},

0 commit comments

Comments
 (0)