зеркало из https://github.com/mozilla/treeherder.git
Bug 1364894 - Load HTML with html-loader not raw-loader
Neutrino 4 configures `file-loader` as the loader for HTML (rather than the more usual `html-loader`), which means the HTML is not parsed to look for further dependencies such as `<img src="...">` tags. Our custom Neutrino config overrode that to `raw-loader` (presumably to work around bugs caused by the use of `file-loader`), which doesn't parse HTML either. Instead, these assets were being manually copied to `dist/img/` by `neutrino-custom/production.js`'s `CopyPlugin` rule, effectively circumventing the webpack build process. Newer Neutrino correctly uses `html-loader`, causing our HTML to be parsed during the webpack build for the first time. However now that the images are being resolved at build time rather than runtime, the relative paths need to be updated to account for the directory layout differences between `src/` and `dist/`, to prevent build errors. A significant benefit of this change is that images referenced from HTML will now be output with hashed filenames, meaning they get given long-lived `Cache-Control` headers by WhiteNoise. See: https://webpack.js.org/loaders/file-loader/ https://webpack.js.org/loaders/raw-loader/ https://webpack.js.org/loaders/html-loader/
This commit is contained in:
Ed Morley
Родитель
ab3b767ba4
Коммит
49339088f6
|
|
@ -93,26 +93,18 @@ module.exports = neutrino => {
|
|||
.rule('compile')
|
||||
.include(UI);
|
||||
|
||||
// The page templates should be excluded from the file-loader, so that they don't collide with the html plugins:
|
||||
neutrino.config
|
||||
.module
|
||||
.rule('html')
|
||||
._exclude
|
||||
.add([USERGUIDE_TEMPLATE, PERF_TEMPLATE, LOGVIEWER_TEMPLATE,
|
||||
INDEX_TEMPLATE, FAILUREVIEWER_TEMPLATE]);
|
||||
|
||||
// Don't use file loader for html...
|
||||
// https://github.com/mozilla-neutrino/neutrino-dev/blob/v4.2.0/packages/neutrino-preset-web/src/index.js#L64-L69
|
||||
neutrino.config
|
||||
.module
|
||||
.rule('html')
|
||||
.loaders.delete('file');
|
||||
// Instead, use the raw loader, which will allow us to get the contents
|
||||
// of the templates and load them into the templateCache automatically;
|
||||
// See ui/js/cache-templates.js.
|
||||
// Instead, use html-loader, like Neutrino 8:
|
||||
// https://github.com/mozilla-neutrino/neutrino-dev/blob/v8.0.18/packages/html-loader/index.js#L7
|
||||
neutrino.config
|
||||
.module
|
||||
.rule('html')
|
||||
.loader('raw', require.resolve('raw-loader'));
|
||||
.loader('html', require.resolve('html-loader'));
|
||||
|
||||
// Backport Neutrino 8's `test` regex, since Neutrino 4 omitted `.gif`:
|
||||
// https://github.com/mozilla-neutrino/neutrino-dev/blob/v4.2.0/packages/neutrino-preset-web/src/index.js#L108
|
||||
|
|
|
|||
|
|
@ -28,6 +28,7 @@
|
|||
"font-awesome": "4.7.0",
|
||||
"hawk": "6.0.2",
|
||||
"history": "4.7.2",
|
||||
"html-loader": "0.5.5",
|
||||
"jquery": "3.3.1",
|
||||
"jquery.flot": "0.8.3",
|
||||
"jquery.scrollto": "2.1.2",
|
||||
|
|
@ -44,7 +45,6 @@
|
|||
"numeral": "2.0.6",
|
||||
"popper.js": "1.12.9",
|
||||
"prop-types": "15.6.0",
|
||||
"raw-loader": "0.5.1",
|
||||
"react": "16.2.0",
|
||||
"react-dom": "16.2.0",
|
||||
"react-fontawesome": "1.6.1",
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<div id="datapoint-detail" ng-show="newRevision">
|
||||
<div ng-if="dataLoading">
|
||||
Loading all results, please wait a minute...
|
||||
<img src="img/dancing_cat.gif" />
|
||||
<img src="../../img/dancing_cat.gif" />
|
||||
</div>
|
||||
<div id="error" ng-if="!dataLoading && errors.length">
|
||||
<compare-error errors="errors" original-revision="originalRevision" original-project="originalProject" new-revision="newRevision" new-project="newProject"></compare-error>
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<div class="container-fluid">
|
||||
<div ng-if="dataLoading">
|
||||
Loading all results, please wait a minute...
|
||||
<img src="img/dancing_cat.gif" />
|
||||
<img src="img/dancing_cat.gif" ng-repeat="x in [0,1,2,3]" style="transform:scale(0.5); margin-left:-40px; margin-top:40px;"/>
|
||||
<img src="../../img/dancing_cat.gif" />
|
||||
<img src="../../img/dancing_cat.gif" ng-repeat="x in [0,1,2,3]" style="transform:scale(0.5); margin-left:-40px; margin-top:40px;"/>
|
||||
</div>
|
||||
<div id="error" ng-if="!dataLoading && errors.length">
|
||||
<compare-error errors="errors" original-revision="originalRevision" original-project="originalProject" new-revision="newRevision" new-project="newProject"></compare-error>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,7 @@
|
|||
<div class="container-fluid">
|
||||
<div ng-show="dataLoading">
|
||||
Loading all results, please wait a minute...
|
||||
<img src="img/dancing_cat.gif" />
|
||||
<img src="../../img/dancing_cat.gif" />
|
||||
</div>
|
||||
<div ng-show="!dataLoading">
|
||||
<h2>{{platform}}: {{testName}} replicate distribution</h2>
|
||||
|
|
|
|||
|
|
@ -21,7 +21,7 @@
|
|||
</div>
|
||||
<div ng-if="dataLoading">
|
||||
Loading all results, please wait a minute...
|
||||
<img src="img/dancing_cat.gif" />
|
||||
<img src="../../img/dancing_cat.gif" />
|
||||
</div>
|
||||
<div ng-if="!dataLoading && !revisionNotFound">
|
||||
<ph-compare-table
|
||||
|
|
|
|||
|
|
@ -18,7 +18,7 @@
|
|||
</div>
|
||||
<div ng-if="dataLoading">
|
||||
Loading all results, please wait a minute...
|
||||
<img src="img/dancing_cat.gif"/>
|
||||
<img src="../../img/dancing_cat.gif"/>
|
||||
</div>
|
||||
<div ng-if="!dataLoading">
|
||||
<ph-compare-table
|
||||
|
|
|
|||
|
|
@ -45,7 +45,7 @@
|
|||
</div>
|
||||
<div ng-if="dataLoading">
|
||||
Loading all results, please wait a minute...
|
||||
<img src="img/dancing_cat.gif" />
|
||||
<img src="../../img/dancing_cat.gif" />
|
||||
</div>
|
||||
<div ng-if="!dataLoading">
|
||||
<ph-compare-table
|
||||
|
|
|
|||
|
|
@ -44,7 +44,7 @@
|
|||
</div>
|
||||
<div ng-if="dataLoading">
|
||||
Loading all results, please wait a minute...
|
||||
<img src="img/dancing_cat.gif" />
|
||||
<img src="../../img/dancing_cat.gif" />
|
||||
</div>
|
||||
<div ng-if="!dataLoading">
|
||||
<ph-compare-table
|
||||
|
|
|
|||
|
|
@ -22,21 +22,21 @@
|
|||
href="{{::lvUrl}}"
|
||||
copy-value="{{::lvFullUrl}}"
|
||||
class="">
|
||||
<img src="./img/logviewerIcon.svg"
|
||||
<img src="../img/logviewerIcon.svg"
|
||||
class="logviewer-icon"><img>
|
||||
</a>
|
||||
<a ng-if="job_log_url.parse_status == 'failed'"
|
||||
id="logviewer-btn"
|
||||
title="Log parsing has failed"
|
||||
class="disabled" >
|
||||
<img src="./img/logviewerIcon.svg"
|
||||
<img src="../img/logviewerIcon.svg"
|
||||
class="logviewer-icon"><img>
|
||||
</a>
|
||||
<a ng-if="job_log_url.parse_status == 'pending'"
|
||||
id="logviewer-btn"
|
||||
class="disabled"
|
||||
title="Log parsing in progress">
|
||||
<img src="./img/logviewerIcon.svg"
|
||||
<img src="../img/logviewerIcon.svg"
|
||||
class="logviewer-icon"><img>
|
||||
</a>
|
||||
</li>
|
||||
|
|
@ -45,7 +45,7 @@
|
|||
id="logviewer-btn"
|
||||
class="disabled"
|
||||
title="No logs available for this job">
|
||||
<img src="./img/logviewerIcon.svg"
|
||||
<img src="../img/logviewerIcon.svg"
|
||||
class="logviewer-icon"><img>
|
||||
</a>
|
||||
</li>
|
||||
|
|
|
|||
48
yarn.lock
48
yarn.lock
|
|
@ -327,6 +327,10 @@ assign-symbols@^1.0.0:
|
|||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/assign-symbols/-/assign-symbols-1.0.0.tgz#59667f41fadd4f20ccbc2bb96b8d4f7f78ec0367"
|
||||
|
||||
ast-types@0.9.6:
|
||||
version "0.9.6"
|
||||
resolved "https://registry.yarnpkg.com/ast-types/-/ast-types-0.9.6.tgz#102c9e9e9005d3e7e3829bf0c4fa24ee862ee9b9"
|
||||
|
||||
async-each@^1.0.0:
|
||||
version "1.0.1"
|
||||
resolved "https://registry.yarnpkg.com/async-each/-/async-each-1.0.1.tgz#19d386a1d9edc6e7c1c85d388aedbcc56d33602d"
|
||||
|
|
@ -2727,6 +2731,13 @@ es6-symbol@3.1.1, es6-symbol@^3.1.1, es6-symbol@~3.1.1:
|
|||
d "1"
|
||||
es5-ext "~0.10.14"
|
||||
|
||||
es6-templates@^0.2.3:
|
||||
version "0.2.3"
|
||||
resolved "https://registry.yarnpkg.com/es6-templates/-/es6-templates-0.2.3.tgz#5cb9ac9fb1ded6eb1239342b81d792bbb4078ee4"
|
||||
dependencies:
|
||||
recast "~0.11.12"
|
||||
through "~2.3.6"
|
||||
|
||||
es6-weak-map@^2.0.1:
|
||||
version "2.0.2"
|
||||
resolved "https://registry.yarnpkg.com/es6-weak-map/-/es6-weak-map-2.0.2.tgz#5e3ab32251ffd1538a1f8e5ffa1357772f92d96f"
|
||||
|
|
@ -2881,6 +2892,10 @@ esprima@^4.0.0:
|
|||
version "4.0.0"
|
||||
resolved "https://registry.yarnpkg.com/esprima/-/esprima-4.0.0.tgz#4499eddcd1110e0b218bacf2fa7f7f59f55ca804"
|
||||
|
||||
esprima@~3.1.0:
|
||||
version "3.1.3"
|
||||
resolved "https://registry.yarnpkg.com/esprima/-/esprima-3.1.3.tgz#fdca51cee6133895e3c88d535ce49dbff62a4633"
|
||||
|
||||
esquery@^1.0.0:
|
||||
version "1.0.0"
|
||||
resolved "https://registry.yarnpkg.com/esquery/-/esquery-1.0.0.tgz#cfba8b57d7fba93f17298a8a006a04cda13d80fa"
|
||||
|
|
@ -3689,7 +3704,17 @@ html-entities@^1.2.0:
|
|||
version "1.2.1"
|
||||
resolved "https://registry.yarnpkg.com/html-entities/-/html-entities-1.2.1.tgz#0df29351f0721163515dfb9e5543e5f6eed5162f"
|
||||
|
||||
html-minifier@^3.2.3:
|
||||
html-loader@0.5.5:
|
||||
version "0.5.5"
|
||||
resolved "https://registry.yarnpkg.com/html-loader/-/html-loader-0.5.5.tgz#6356dbeb0c49756d8ebd5ca327f16ff06ab5faea"
|
||||
dependencies:
|
||||
es6-templates "^0.2.3"
|
||||
fastparse "^1.1.1"
|
||||
html-minifier "^3.5.8"
|
||||
loader-utils "^1.1.0"
|
||||
object-assign "^4.1.1"
|
||||
|
||||
html-minifier@^3.2.3, html-minifier@^3.5.8:
|
||||
version "3.5.8"
|
||||
resolved "https://registry.yarnpkg.com/html-minifier/-/html-minifier-3.5.8.tgz#5ccdb1f73a0d654e6090147511f6e6b2ee312700"
|
||||
dependencies:
|
||||
|
|
@ -4508,7 +4533,7 @@ loader-utils@^0.2.15, loader-utils@^0.2.16, loader-utils@^0.2.5:
|
|||
json5 "^0.5.0"
|
||||
object-assign "^4.0.1"
|
||||
|
||||
loader-utils@^1.0.2:
|
||||
loader-utils@^1.0.2, loader-utils@^1.1.0:
|
||||
version "1.1.0"
|
||||
resolved "https://registry.yarnpkg.com/loader-utils/-/loader-utils-1.1.0.tgz#c98aef488bcceda2ffb5e2de646d6a754429f5cd"
|
||||
dependencies:
|
||||
|
|
@ -5880,7 +5905,7 @@ pretty-error@^2.0.2:
|
|||
renderkid "^2.0.1"
|
||||
utila "~0.4"
|
||||
|
||||
private@^0.1.6, private@^0.1.7:
|
||||
private@^0.1.6, private@^0.1.7, private@~0.1.5:
|
||||
version "0.1.8"
|
||||
resolved "https://registry.yarnpkg.com/private/-/private-0.1.8.tgz#2381edb3689f7a53d653190060fcf822d2f368ff"
|
||||
|
||||
|
|
@ -6054,10 +6079,6 @@ raw-body@2.3.2:
|
|||
iconv-lite "0.4.19"
|
||||
unpipe "1.0.0"
|
||||
|
||||
raw-loader@0.5.1:
|
||||
version "0.5.1"
|
||||
resolved "https://registry.yarnpkg.com/raw-loader/-/raw-loader-0.5.1.tgz#0c3d0beaed8a01c966d9787bf778281252a979aa"
|
||||
|
||||
rc@^1.1.7:
|
||||
version "1.2.4"
|
||||
resolved "https://registry.yarnpkg.com/rc/-/rc-1.2.4.tgz#a0f606caae2a3b862bbd0ef85482c0125b315fa3"
|
||||
|
|
@ -6278,6 +6299,15 @@ readline2@^1.0.1:
|
|||
is-fullwidth-code-point "^1.0.0"
|
||||
mute-stream "0.0.5"
|
||||
|
||||
recast@~0.11.12:
|
||||
version "0.11.23"
|
||||
resolved "https://registry.yarnpkg.com/recast/-/recast-0.11.23.tgz#451fd3004ab1e4df9b4e4b66376b2a21912462d3"
|
||||
dependencies:
|
||||
ast-types "0.9.6"
|
||||
esprima "~3.1.0"
|
||||
private "~0.1.5"
|
||||
source-map "~0.5.0"
|
||||
|
||||
rechoir@^0.6.2:
|
||||
version "0.6.2"
|
||||
resolved "https://registry.yarnpkg.com/rechoir/-/rechoir-0.6.2.tgz#85204b54dba82d5742e28c96756ef43af50e3384"
|
||||
|
|
@ -6854,7 +6884,7 @@ source-map@0.5.6:
|
|||
version "0.5.6"
|
||||
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.6.tgz#75ce38f52bf0733c5a7f0c118d81334a2bb5f412"
|
||||
|
||||
source-map@0.5.x, source-map@^0.5.1, source-map@^0.5.3, source-map@^0.5.6, source-map@~0.5.1, source-map@~0.5.3:
|
||||
source-map@0.5.x, source-map@^0.5.1, source-map@^0.5.3, source-map@^0.5.6, source-map@~0.5.0, source-map@~0.5.1, source-map@~0.5.3:
|
||||
version "0.5.7"
|
||||
resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.5.7.tgz#8a039d2d1021d22d1ea14c80d8ea468ba2ef3fcc"
|
||||
|
||||
|
|
@ -7176,7 +7206,7 @@ text-table@~0.2.0:
|
|||
version "0.2.0"
|
||||
resolved "https://registry.yarnpkg.com/text-table/-/text-table-0.2.0.tgz#7f5ee823ae805207c00af2df4a84ec3fcfa570b4"
|
||||
|
||||
through@^2.3.6:
|
||||
through@^2.3.6, through@~2.3.6:
|
||||
version "2.3.8"
|
||||
resolved "https://registry.yarnpkg.com/through/-/through-2.3.8.tgz#0dd4c9ffaabc357960b1b724115d7e0e86a2e1f5"
|
||||
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче