Skip to content

Commit 874235d

Browse files
committed
Modify images/fonts loaders so a hash is always added to the name of output files
1 parent f8fa5c0 commit 874235d

File tree

5 files changed

+81
-16
lines changed

5 files changed

+81
-16
lines changed

fixtures/css/same_filename.css

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
h4 {
2+
background: top left url('./../images/symfony_logo.png') no-repeat;
3+
}
4+
5+
h5 {
6+
background: top left url('./../images/same_filename/symfony_logo.png') no-repeat;
7+
}
8+
9+
@font-face {
10+
font-family: 'Roboto';
11+
src: url('./../fonts/Roboto.woff2') format('woff2');
12+
}
13+
14+
@font-face {
15+
font-family: 'Roboto2';
16+
src: url('./../fonts/same_filename/Roboto.woff2') format('woff2');
17+
}
62.8 KB
Binary file not shown.
15.6 KB
Loading

lib/config-generator.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -127,15 +127,15 @@ class ConfigGenerator {
127127
test: /\.(png|jpg|jpeg|gif|ico|svg)$/,
128128
loader: 'file-loader',
129129
options: {
130-
name: `images/[name]${this.webpackConfig.useVersioning ? '.[hash]' : ''}.[ext]`,
130+
name: 'images/[name].[hash].[ext]',
131131
publicPath: this.webpackConfig.getRealPublicPath()
132132
}
133133
},
134134
{
135135
test: /\.(woff|woff2|ttf|eot|otf)$/,
136136
loader: 'file-loader',
137137
options: {
138-
name: `fonts/[name]${this.webpackConfig.useVersioning ? '.[hash]' : ''}.[ext]`,
138+
name: 'fonts/[name].[hash].[ext]',
139139
publicPath: this.webpackConfig.getRealPublicPath()
140140
}
141141
},

test/functional.js

Lines changed: 62 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -62,8 +62,8 @@ describe('Functional tests using webpack', function() {
6262
'main.js',
6363
'font.css',
6464
'bg.css',
65-
'fonts/Roboto.woff2',
66-
'images/symfony_logo.png',
65+
'fonts/Roboto.9896f773628188b649ed5824fa363290.woff2',
66+
'images/symfony_logo.ea1ca6f7f3719118f301a5cfcb1df3c0.png',
6767
'manifest.json'
6868
]);
6969

@@ -87,11 +87,11 @@ describe('Functional tests using webpack', function() {
8787
);
8888
webpackAssert.assertManifestPath(
8989
'build/fonts/Roboto.woff2',
90-
'/build/fonts/Roboto.woff2'
90+
'/build/fonts/Roboto.9896f773628188b649ed5824fa363290.woff2'
9191
);
9292
webpackAssert.assertManifestPath(
9393
'build/images/symfony_logo.png',
94-
'/build/images/symfony_logo.png'
94+
'/build/images/symfony_logo.ea1ca6f7f3719118f301a5cfcb1df3c0.png'
9595
);
9696

9797
done();
@@ -119,11 +119,11 @@ describe('Functional tests using webpack', function() {
119119

120120
webpackAssert.assertOutputFileContains(
121121
'bg.css',
122-
'http://localhost:8090/assets/images/symfony_logo.png'
122+
'http://localhost:8090/assets/images/symfony_logo.ea1ca6f7f3719118f301a5cfcb1df3c0.png'
123123
);
124124
webpackAssert.assertOutputFileContains(
125125
'font.css',
126-
'http://localhost:8090/assets/fonts/Roboto.woff2'
126+
'http://localhost:8090/assets/fonts/Roboto.9896f773628188b649ed5824fa363290.woff2'
127127
);
128128
// manifest file has CDN in value
129129
webpackAssert.assertManifestPath(
@@ -172,7 +172,7 @@ describe('Functional tests using webpack', function() {
172172

173173
webpackAssert.assertOutputFileContains(
174174
'bg.css',
175-
'http://localhost:8090/assets/images/symfony_logo.png'
175+
'http://localhost:8090/assets/images/symfony_logo.ea1ca6f7f3719118f301a5cfcb1df3c0.png'
176176
);
177177
// manifest file has CDN in value
178178
webpackAssert.assertManifestPath(
@@ -323,28 +323,76 @@ describe('Functional tests using webpack', function() {
323323

324324
expect(path.join(config.outputPath, 'images')).to.be.a.directory()
325325
.with.files([
326-
'symfony_logo.png'
326+
'symfony_logo.ea1ca6f7f3719118f301a5cfcb1df3c0.png'
327327
]
328328
);
329329

330330
expect(path.join(config.outputPath, 'fonts')).to.be.a.directory()
331331
.with.files([
332-
'Roboto.woff2'
332+
'Roboto.9896f773628188b649ed5824fa363290.woff2'
333333
]
334334
);
335335

336336
webpackAssert.assertOutputFileContains(
337337
'bg.css',
338-
'/build/images/symfony_logo.png'
338+
'/build/images/symfony_logo.ea1ca6f7f3719118f301a5cfcb1df3c0.png'
339339
);
340+
340341
webpackAssert.assertOutputFileContains(
341342
'font.css',
342-
'/build/fonts/Roboto.woff2'
343+
'/build/fonts/Roboto.9896f773628188b649ed5824fa363290.woff2'
344+
);
345+
346+
done();
347+
});
348+
});
349+
350+
it('two fonts or images with the same filename should not output a single file', (done) => {
351+
const config = createWebpackConfig('www/build', 'dev');
352+
config.setPublicPath('/build');
353+
config.addStyleEntry('styles', './css/same_filename.css');
354+
config.enableSassLoader();
355+
356+
testSetup.runWebpack(config, (webpackAssert) => {
357+
expect(config.outputPath).to.be.a.directory()
358+
.with.files([
359+
'styles.css',
360+
'manifest.json'
361+
]
362+
);
363+
364+
expect(path.join(config.outputPath, 'images')).to.be.a.directory()
365+
.with.files([
366+
'symfony_logo.ea1ca6f7f3719118f301a5cfcb1df3c0.png',
367+
'symfony_logo.f27119c20951b473f2de80c000d60fa8.png'
368+
]
369+
);
370+
371+
expect(path.join(config.outputPath, 'fonts')).to.be.a.directory()
372+
.with.files([
373+
'Roboto.9896f773628188b649ed5824fa363290.woff2',
374+
'Roboto.3c37aa69cd77e6a53a067170fa8fe2e9.woff2'
375+
]
343376
);
344377

345378
webpackAssert.assertOutputFileContains(
346-
'font.css',
347-
'/build/fonts/Roboto.woff2'
379+
'styles.css',
380+
'/build/images/symfony_logo.ea1ca6f7f3719118f301a5cfcb1df3c0.png'
381+
);
382+
383+
webpackAssert.assertOutputFileContains(
384+
'styles.css',
385+
'/build/images/symfony_logo.f27119c20951b473f2de80c000d60fa8.png'
386+
);
387+
388+
webpackAssert.assertOutputFileContains(
389+
'styles.css',
390+
'/build/fonts/Roboto.9896f773628188b649ed5824fa363290.woff2'
391+
);
392+
393+
webpackAssert.assertOutputFileContains(
394+
'styles.css',
395+
'/build/fonts/Roboto.3c37aa69cd77e6a53a067170fa8fe2e9.woff2'
348396
);
349397

350398
done();
@@ -687,7 +735,7 @@ module.exports = {
687735
expect(config.outputPath).to.be.a.directory().with.deep.files([
688736
'main.js',
689737
'main.css',
690-
'images/logo.png',
738+
'images/logo.82b9c7a5a3f405032b1db71a25f67021.png',
691739
'manifest.json'
692740
]);
693741

0 commit comments

Comments
 (0)