Skip to content

Commit ab109cd

Browse files
weaverryanweaverryan
committed
Changing entrypoints.json values to include the manifest key prefix
This will make it SUPER easy to find the final paths: 1) Look up all the CSS or JS files for entry "foo_bar" 2) The values you get back can immediately be used to lookup the final path in manifest.json
1 parent 3c1b790 commit ab109cd

File tree

5 files changed

+68
-41
lines changed

5 files changed

+68
-41
lines changed

‎lib/plugins/entry-files-manifest.js

+2
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ const EntryFilesManifestPlugin = require('../webpack/entry-files-manifest-plugin
1313
const PluginPriorities = require('./plugin-priorities');
1414
const path = require('path');
1515
const sharedEntryTmpName = require('../utils/sharedEntryTmpName');
16+
const manifestKeyPrefixHelper = require('../utils/manifest-key-prefix-helper');
1617

1718
/**
1819
* @param {Array} plugins
@@ -24,6 +25,7 @@ module.exports = function(plugins, webpackConfig) {
2425
plugins.push({
2526
plugin: new EntryFilesManifestPlugin(
2627
path.join(webpackConfig.outputPath, 'entrypoints.json'),
28+
manifestKeyPrefixHelper(webpackConfig),
2729
[sharedEntryTmpName],
2830
webpackConfig.styleEntries
2931
),

‎lib/plugins/manifest.js

+2-8
Original file line numberDiff line numberDiff line change
@@ -13,22 +13,16 @@ const ManifestPlugin = require('webpack-manifest-plugin');
1313
const PluginPriorities = require('./plugin-priorities');
1414
const applyOptionsCallback = require('../utils/apply-options-callback');
1515
const sharedEntryTmpName = require('../utils/sharedEntryTmpName');
16+
const manifestKeyPrefixHelper = require('../utils/manifest-key-prefix-helper');
1617

1718
/**
1819
* @param {Array} plugins
1920
* @param {WebpackConfig} webpackConfig
2021
* @return {void}
2122
*/
2223
module.exports = function(plugins, webpackConfig) {
23-
24-
let manifestPrefix = webpackConfig.manifestKeyPrefix;
25-
if (null === manifestPrefix) {
26-
// by convention, we remove the opening slash on the manifest keys
27-
manifestPrefix = webpackConfig.publicPath.replace(/^\//, '');
28-
}
29-
3024
const manifestPluginOptions = {
31-
basePath: manifestPrefix,
25+
basePath: manifestKeyPrefixHelper(webpackConfig),
3226
// always write a manifest.json file, even with webpack-dev-server
3327
writeToFileEmit: true,
3428
filter: (file) => {

‎lib/utils/manifest-key-prefix-helper.js

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
/*
2+
* This file is part of the Symfony Webpack Encore package.
3+
*
4+
* (c) Fabien Potencier <[email protected]>
5+
*
6+
* For the full copyright and license information, please view the LICENSE
7+
* file that was distributed with this source code.
8+
*/
9+
10+
'use strict';
11+
12+
/**
13+
* Helper for determining the manifest.json key prefix.
14+
*
15+
* @param {WebpackConfig} webpackConfig
16+
* @return {string}
17+
*/
18+
module.exports = function(webpackConfig) {
19+
let manifestPrefix = webpackConfig.manifestKeyPrefix;
20+
if (null === manifestPrefix) {
21+
// by convention, we remove the opening slash on the manifest keys
22+
manifestPrefix = webpackConfig.publicPath.replace(/^\//, '');
23+
}
24+
25+
return manifestPrefix;
26+
};

‎lib/webpack/entry-files-manifest-plugin.js

+12-7
Original file line numberDiff line numberDiff line change
@@ -14,8 +14,9 @@ const fse = require('fs-extra');
1414

1515
const bugMessage = 'This is possibly a bug, but will not impact your setup unless you use the entrypoints.json (e.g. splitEntryChunks()) file. To be super awesome, please report this as an issue.';
1616

17-
function EntryFilesManifestPlugin(manifestFilename, entryNamesToSkip, styleEntriesMap) {
17+
function EntryFilesManifestPlugin(manifestFilename, manifestKeyPrefix, entryNamesToSkip, styleEntriesMap) {
1818
this.manifestFilename = manifestFilename;
19+
this.manifestKeyPrefix = manifestKeyPrefix;
1920
this.entryNamesToSkip = entryNamesToSkip;
2021
this.styleEntriesMap = styleEntriesMap;
2122
}
@@ -78,14 +79,17 @@ function convertChunkIdsToChunkNames(allChunks, chunkIds) {
7879
).filter(chunkName => chunkName !== false);
7980
}
8081

81-
function convertChunkNamesToFilenames(chunkNames, extension) {
82+
function convertChunkNamesToFilenames(chunkNames, extension, manifestKeyPrefix) {
8283
return chunkNames.map(chunkName => {
84+
let chunkFilename = chunkName;
85+
8386
// possible for the async-split chunks
84-
if (chunkName.endsWith(`.${extension}`)) {
85-
return chunkName;
87+
if (!chunkName.endsWith(`.${extension}`)) {
88+
chunkFilename = `${chunkName}.${extension}`;
8689
}
8790

88-
return `${chunkName}.${extension}`;
91+
// make the filename match the key in manifest.json
92+
return `${manifestKeyPrefix}/${chunkFilename}`;
8993
});
9094
}
9195

@@ -109,8 +113,9 @@ EntryFilesManifestPlugin.prototype.apply = function(compiler) {
109113
const cssChunkNames = convertChunkIdsToChunkNames(stats.compilation.chunks, cssChunkIds);
110114
const jsChunkNames = convertChunkIdsToChunkNames(stats.compilation.chunks, jsChunkIds);
111115

112-
const cssFiles = convertChunkNamesToFilenames(cssChunkNames, 'css');
113-
const jsFiles = convertChunkNamesToFilenames(jsChunkNames, 'js');
116+
const cleanPrefix = this.manifestKeyPrefix.replace(/\/$/, '');
117+
const cssFiles = convertChunkNamesToFilenames(cssChunkNames, 'css', cleanPrefix);
118+
const jsFiles = convertChunkNamesToFilenames(jsChunkNames, 'js', cleanPrefix);
114119

115120
entrypoints[entryName] = {
116121
js: jsFiles,

‎test/functional.js

+26-26
Original file line numberDiff line numberDiff line change
@@ -103,17 +103,17 @@ describe('Functional tests using webpack', function() {
103103

104104
webpackAssert.assertOutputJsonFileMatches('entrypoints.json', {
105105
main: {
106-
js: ['runtime.js', 'main.js'],
106+
js: ['build/runtime.js', 'build/main.js'],
107107
css: []
108108
},
109109
font: {
110110
// no runtime for style entries
111111
js: [],
112-
css: ['font.css']
112+
css: ['build/font.css']
113113
},
114114
bg: {
115115
js: [],
116-
css: ['bg.css']
116+
css: ['build/bg.css']
117117
},
118118
});
119119

@@ -134,12 +134,12 @@ describe('Functional tests using webpack', function() {
134134
testSetup.runWebpack(config, (webpackAssert) => {
135135
webpackAssert.assertOutputJsonFileMatches('entrypoints.json', {
136136
main: {
137-
js: ['runtime.js', 'vendors~main~other.js', 'main~other.js', 'main.js'],
138-
css: ['main~other.css']
137+
js: ['build/runtime.js', 'build/vendors~main~other.js', 'build/main~other.js', 'build/main.js'],
138+
css: ['build/main~other.css']
139139
},
140140
other: {
141-
js: ['runtime.js', 'vendors~main~other.js', 'main~other.js', 'other.js'],
142-
css: ['main~other.css']
141+
js: ['build/runtime.js', 'build/vendors~main~other.js', 'build/main~other.js', 'build/other.js'],
142+
css: ['build/main~other.css']
143143
},
144144
});
145145

@@ -692,12 +692,12 @@ describe('Functional tests using webpack', function() {
692692
// but the _tmp_shared entry is NOT here
693693
webpackAssert.assertOutputJsonFileMatches('entrypoints.json', {
694694
main: {
695-
js: ['runtime.js', 'shared.js', 'main.js'],
696-
css: ['shared.css']
695+
js: ['build/runtime.js', 'build/shared.js', 'build/main.js'],
696+
css: ['build/shared.css']
697697
},
698698
other: {
699-
js: ['runtime.js', 'shared.js', 'other.js'],
700-
css: ['shared.css']
699+
js: ['build/runtime.js', 'build/shared.js', 'build/other.js'],
700+
css: ['build/shared.css']
701701
},
702702
});
703703

@@ -1318,12 +1318,12 @@ module.exports = {
13181318
testSetup.runWebpack(config, (webpackAssert) => {
13191319
webpackAssert.assertOutputJsonFileMatches('entrypoints.json', {
13201320
main: {
1321-
js: ['runtime.js', 'vendors~main~other.js', 'main~other.js', 'main.js'],
1322-
css: ['main~other.css']
1321+
js: ['build/runtime.js', 'build/vendors~main~other.js', 'build/main~other.js', 'build/main.js'],
1322+
css: ['build/main~other.css']
13231323
},
13241324
other: {
1325-
js: ['runtime.js', 'vendors~main~other.js', 'main~other.js', 'other.js'],
1326-
css: ['main~other.css']
1325+
js: ['build/runtime.js', 'build/vendors~main~other.js', 'build/main~other.js', 'build/other.js'],
1326+
css: ['build/main~other.css']
13271327
},
13281328
});
13291329

@@ -1334,7 +1334,7 @@ module.exports = {
13341334
});
13351335
});
13361336

1337-
it('Custom public path does not affect entrypoints.json or manifest.json', (done) => {
1337+
it('Custom public path does affect entrypoints.json or manifest.json', (done) => {
13381338
const config = createWebpackConfig('web/build', 'dev');
13391339
config.addEntry('main', ['./css/roboto_font.css', './js/no_require', 'vue']);
13401340
config.addEntry('other', ['./css/roboto_font.css', 'vue']);
@@ -1348,12 +1348,12 @@ module.exports = {
13481348
testSetup.runWebpack(config, (webpackAssert) => {
13491349
webpackAssert.assertOutputJsonFileMatches('entrypoints.json', {
13501350
main: {
1351-
js: ['runtime.js', 'vendors~main~other.js', 'main~other.js', 'main.js'],
1352-
css: ['main~other.css']
1351+
js: ['custom_prefix/runtime.js', 'custom_prefix/vendors~main~other.js', 'custom_prefix/main~other.js', 'custom_prefix/main.js'],
1352+
css: ['custom_prefix/main~other.css']
13531353
},
13541354
other: {
1355-
js: ['runtime.js', 'vendors~main~other.js', 'main~other.js', 'other.js'],
1356-
css: ['main~other.css']
1355+
js: ['custom_prefix/runtime.js', 'custom_prefix/vendors~main~other.js', 'custom_prefix/main~other.js', 'custom_prefix/other.js'],
1356+
css: ['custom_prefix/main~other.css']
13571357
},
13581358
});
13591359

@@ -1378,12 +1378,12 @@ module.exports = {
13781378
// in production, we hash the chunk names to avoid exposing any extra details
13791379
webpackAssert.assertOutputJsonFileMatches('entrypoints.json', {
13801380
main: {
1381-
js: ['runtime.js', 'vendors~cc515e6e.js', 'default~cc515e6e.js', 'main.js'],
1382-
css: ['default~cc515e6e.css']
1381+
js: ['build/runtime.js', 'build/vendors~cc515e6e.js', 'build/default~cc515e6e.js', 'build/main.js'],
1382+
css: ['build/default~cc515e6e.css']
13831383
},
13841384
other: {
1385-
js: ['runtime.js', 'vendors~cc515e6e.js', 'default~cc515e6e.js', 'other.js'],
1386-
css: ['default~cc515e6e.css']
1385+
js: ['build/runtime.js', 'build/vendors~cc515e6e.js', 'build/default~cc515e6e.js', 'build/other.js'],
1386+
css: ['build/default~cc515e6e.css']
13871387
},
13881388
});
13891389

@@ -1409,13 +1409,13 @@ module.exports = {
14091409
testSetup.runWebpack(config, (webpackAssert) => {
14101410
webpackAssert.assertOutputJsonFileMatches('entrypoints.json', {
14111411
main: {
1412-
js: ['runtime.js', 'vendors~main~other.js', 'main.js'],
1412+
js: ['build/runtime.js', 'build/vendors~main~other.js', 'build/main.js'],
14131413
css: []
14141414
},
14151415
other: {
14161416
// the 0.[hash].js is because the "no_require" module was already split to this
14171417
// so, it has that filename, instead of following the normal pattern
1418-
js: ['runtime.js', 'vendors~main~other.js', '0.f1e0a935.js', 'other.js'],
1418+
js: ['build/runtime.js', 'build/vendors~main~other.js', 'build/0.f1e0a935.js', 'build/other.js'],
14191419
css: []
14201420
},
14211421
});

0 commit comments

Comments
 (0)