From 14658d3d5da42075ffbce34c153c00a940e33426 Mon Sep 17 00:00:00 2001 From: Wyatt Johnson Date: Mon, 15 Oct 2018 16:43:20 -0600 Subject: [PATCH] review: suggested improvements --- src/core/build/createWebpackConfig.ts | 29 ++++++++++++++----- ...ackPlugin.ts => PublicURIWebpackPlugin.ts} | 22 +++++--------- 2 files changed, 29 insertions(+), 22 deletions(-) rename src/core/build/plugins/{CDNWebpackPlugin.ts => PublicURIWebpackPlugin.ts} (77%) diff --git a/src/core/build/createWebpackConfig.ts b/src/core/build/createWebpackConfig.ts index 3aad5a28e..5f331d4f2 100644 --- a/src/core/build/createWebpackConfig.ts +++ b/src/core/build/createWebpackConfig.ts @@ -9,7 +9,7 @@ import TsconfigPathsPlugin from "tsconfig-paths-webpack-plugin"; import UglifyJsPlugin from "uglifyjs-webpack-plugin"; import webpack, { Configuration } from "webpack"; import ManifestPlugin from "webpack-manifest-plugin"; -import CDNWebpackPlugin from "./plugins/CDNWebpackPlugin"; +import PublicURIWebpackPlugin from "./plugins/PublicURIWebpackPlugin"; import paths from "./paths"; @@ -40,6 +40,13 @@ export default function createWebpackConfig({ const isProduction = env.NODE_ENV === "production"; + /** + * ifProduction will only include the nodes if we're in production mode. + */ + const ifProduction = isProduction + ? (...nodes: T[]) => nodes + : (...nodes: T[]) => []; + const htmlWebpackConfig: Options = { minify: isProduction && { removeComments: true, @@ -439,14 +446,14 @@ export default function createWebpackConfig({ stream: [ // We ship polyfills by default paths.appPolyfill, - paths.appPublicPath, + ...ifProduction(paths.appPublicPath), ...devServerEntries, paths.appStreamIndex, ], auth: [ // We ship polyfills by default paths.appPolyfill, - paths.appPublicPath, + ...ifProduction(paths.appPublicPath), ...devServerEntries, paths.appAuthIndex, // Remove deactivated entries. @@ -454,14 +461,14 @@ export default function createWebpackConfig({ install: [ // We ship polyfills by default paths.appPolyfill, - paths.appPublicPath, + ...ifProduction(paths.appPublicPath), ...devServerEntries, paths.appInstallIndex, ], admin: [ // We ship polyfills by default paths.appPolyfill, - paths.appPublicPath, + ...ifProduction(paths.appPublicPath), ...devServerEntries, paths.appAdminIndex, ], @@ -500,9 +507,15 @@ export default function createWebpackConfig({ inject: "body", ...htmlWebpackConfig, }), - // Inject the pieces we need here to resolve all the now relative url's - // against the CDN if it's provided. - new CDNWebpackPlugin({ production: isProduction }), + ...ifProduction( + // Inject the pieces we need here to resolve all the now relative url's + // against the CDN if it's provided. It will inject the following into + // the configuration blob on the page. + new PublicURIWebpackPlugin( + "{{ staticURI | dump | safe }}", + "{{ staticURI }}" + ) + ), // Makes some environment variables available in index.html. // The public URL is available as %PUBLIC_URL% in index.html, e.g.: // diff --git a/src/core/build/plugins/CDNWebpackPlugin.ts b/src/core/build/plugins/PublicURIWebpackPlugin.ts similarity index 77% rename from src/core/build/plugins/CDNWebpackPlugin.ts rename to src/core/build/plugins/PublicURIWebpackPlugin.ts index 21f17405d..4edab48eb 100644 --- a/src/core/build/plugins/CDNWebpackPlugin.ts +++ b/src/core/build/plugins/PublicURIWebpackPlugin.ts @@ -1,15 +1,13 @@ import { Hooks } from "html-webpack-plugin"; import { Compiler, Plugin } from "webpack"; -export interface CDNWebpackPluginOptions { - production: boolean; -} +export default class PublicURIWebpackPlugin implements Plugin { + private configTemplate: string; + private prefixTemplate: string; -export default class CDNWebpackPlugin implements Plugin { - private production: boolean; - - constructor({ production }: CDNWebpackPluginOptions) { - this.production = production; + constructor(configTemplate: string, prefixTemplate: string) { + this.configTemplate = configTemplate; + this.prefixTemplate = prefixTemplate; } private prefixAttribute(attr: string | boolean) { @@ -17,7 +15,7 @@ export default class CDNWebpackPlugin implements Plugin { return attr; } - return "{{ staticURI }}" + attr; + return this.prefixTemplate + attr; } private prefixTag = (tag: { @@ -35,10 +33,6 @@ export default class CDNWebpackPlugin implements Plugin { }; public apply = (compiler: Compiler) => { - if (!this.production) { - return; - } - compiler.hooks.compilation.tap("CDNWebpackPlugin", compilation => { (compilation.hooks as Hooks).htmlWebpackPluginAlterAssetTags.tapAsync( "CDNWebpackPlugin", @@ -54,7 +48,7 @@ export default class CDNWebpackPlugin implements Plugin { type: "application/json", id: "config", }, - innerHTML: "{{ staticURI | dump | safe }}", + innerHTML: this.configTemplate, voidTag: false, });