Skip to content

Commit f825ded

Browse files
weaverryanweaverryan
committed
bug #110 Always add a hash to the name of the files created by the default assets loaders (Lyrkan)
This PR was squashed before being merged into the master branch (closes #110). Discussion ---------- Always add a hash to the name of the files created by the default assets loaders This PR modifies the configuration of the default assets loaders so a `[hash]` is always added to the output file names, even if versioning is disabled. It basically prevents having two files with the same name (but in a different directory) overwriting each other during build. This closes #73 and was further discussed in #103. Commits ------- d5cd482 Use [hash:8] for images and fonts filenames instead of [hash] 874235d Modify images/fonts loaders so a hash is always added to the name of output files
2 parents 2376b21 + d5cd482 commit f825ded

File tree

5 files changed

+85
-20
lines changed

5 files changed

+85
-20
lines changed

‎fixtures/css/same_filename.css

+17
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+
}

‎fixtures/fonts/same_filename/Roboto.woff2

62.8 KB
Binary file not shown.

‎fixtures/images/same_filename/symfony_logo.png

15.6 KB
Loading

‎lib/config-generator.js

+2-2
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:8].[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:8].[ext]',
139139
publicPath: this.webpackConfig.getRealPublicPath()
140140
}
141141
},

‎test/functional.js

+66-18
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.9896f773.woff2',
66+
'images/symfony_logo.ea1ca6f7.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.9896f773.woff2'
9191
);
9292
webpackAssert.assertManifestPath(
9393
'build/images/symfony_logo.png',
94-
'/build/images/symfony_logo.png'
94+
'/build/images/symfony_logo.ea1ca6f7.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.ea1ca6f7.png'
123123
);
124124
webpackAssert.assertOutputFileContains(
125125
'font.css',
126-
'http://localhost:8090/assets/fonts/Roboto.woff2'
126+
'http://localhost:8090/assets/fonts/Roboto.9896f773.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.ea1ca6f7.png'
176176
);
177177
// manifest file has CDN in value
178178
webpackAssert.assertManifestPath(
@@ -285,20 +285,20 @@ describe('Functional tests using webpack', function() {
285285
'0.d002be21e9bcf76057e9.js', // chunks are also versioned
286286
'main.292c0347ed1240663cb1.js',
287287
'h1.c84caea6dd12bba7955dee9fedd5fd03.css',
288-
'bg.42ced8eae2254268bb3c65f1e65bd041.css',
288+
'bg.483832e48e67e6a3b7f0ae064eadca51.css',
289289
'manifest.json'
290290
]
291291
);
292292

293293
expect(path.join(config.outputPath, 'images')).to.be.a.directory()
294294
.with.files([
295-
'symfony_logo.ea1ca6f7f3719118f301a5cfcb1df3c0.png'
295+
'symfony_logo.ea1ca6f7.png'
296296
]
297297
);
298298

299299
webpackAssert.assertOutputFileContains(
300-
'bg.42ced8eae2254268bb3c65f1e65bd041.css',
301-
'/build/images/symfony_logo.ea1ca6f7f3719118f301a5cfcb1df3c0.png'
300+
'bg.483832e48e67e6a3b7f0ae064eadca51.css',
301+
'/build/images/symfony_logo.ea1ca6f7.png'
302302
);
303303

304304
done();
@@ -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.ea1ca6f7.png'
327327
]
328328
);
329329

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

336336
webpackAssert.assertOutputFileContains(
337337
'bg.css',
338-
'/build/images/symfony_logo.png'
338+
'/build/images/symfony_logo.ea1ca6f7.png'
339339
);
340+
340341
webpackAssert.assertOutputFileContains(
341342
'font.css',
342-
'/build/fonts/Roboto.woff2'
343+
'/build/fonts/Roboto.9896f773.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.ea1ca6f7.png',
367+
'symfony_logo.f27119c2.png'
368+
]
369+
);
370+
371+
expect(path.join(config.outputPath, 'fonts')).to.be.a.directory()
372+
.with.files([
373+
'Roboto.9896f773.woff2',
374+
'Roboto.3c37aa69.woff2'
375+
]
343376
);
344377

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

350398
done();
@@ -689,7 +737,7 @@ module.exports = {
689737
expect(config.outputPath).to.be.a.directory().with.deep.files([
690738
'main.js',
691739
'main.css',
692-
'images/logo.png',
740+
'images/logo.82b9c7a5.png',
693741
'manifest.json'
694742
]);
695743

0 commit comments

Comments
 (0)