diff --git a/layouts/html.hbs b/layouts/html.hbs index 3b6619164..3563474eb 100644 --- a/layouts/html.hbs +++ b/layouts/html.hbs @@ -85,7 +85,7 @@ }); {{/babel}} - + {{> script/partials/bundle-script-tags }} {{#if global_config.googleAnalyticsId}} diff --git a/script/partials/bundle-script-tags.hbs b/script/partials/bundle-script-tags.hbs new file mode 100644 index 000000000..67292671a --- /dev/null +++ b/script/partials/bundle-script-tags.hbs @@ -0,0 +1,2 @@ + + \ No newline at end of file diff --git a/static/entry-legacy.js b/static/entry-legacy.js new file mode 100644 index 000000000..06365daff --- /dev/null +++ b/static/entry-legacy.js @@ -0,0 +1,8 @@ +// Import global polyfills +import 'core-js/stable'; + +import * as HitchhikerJS from './js/HitchhikerJS'; +window.HitchhikerJS = HitchhikerJS; + +// Import all SCSS +import Scss from './scss/answers/_default.scss'; diff --git a/static/entry.js b/static/entry.js index f571d728e..92f7f43e7 100644 --- a/static/entry.js +++ b/static/entry.js @@ -1,35 +1,5 @@ -// Import global polyfills -import 'core-js/stable'; +import * as HitchhikerJS from './js/HitchhikerJS'; +window.HitchhikerJS = HitchhikerJS; // Import all SCSS -import Scss from './scss/answers/_default.scss'; - -// Import all JS assets -import Formatters from './js/formatters'; -window.Formatter = Formatters; - -export { Formatters }; -export { getDefaultMapApiKey } from './js/default-map-api-key'; -export { isStaging } from './js/is-staging'; -export { isMobile } from 'is-mobile'; -export { getInjectedProp } from './js/get-injected-prop'; -export { isHighlighted } from './js/is-highlighted'; - -// Used to transfigure the page for the Overlay -import Overlay from './js/overlay/answers-frame/overlay'; -window.Overlay = new Overlay(); - -// Import code used in Collapsible Filters, and give it the alias of window.CollapsibleFilters. -import CollapsibleFilters from './js/collapsible-filters'; -export { CollapsibleFilters }; -global.CollapsibleFilters = CollapsibleFilters; - -// Import custom modules which can be accessed from HitchhikerJS.CustomModules -import * as CustomModules from './js/custom-modules'; -export { CustomModules }; - -import StorageKeys from './js/constants/storage-keys'; -export { StorageKeys }; - -import transformFacets from './js/transform-facets'; -export { transformFacets } \ No newline at end of file +import Scss from './scss/answers/_default.scss'; \ No newline at end of file diff --git a/static/js/HitchhikerJS.js b/static/js/HitchhikerJS.js new file mode 100644 index 000000000..afd7ae021 --- /dev/null +++ b/static/js/HitchhikerJS.js @@ -0,0 +1,29 @@ +// Import all JS assets +import Formatters from './formatters'; +window.Formatter = Formatters; + +export { Formatters }; +export { getDefaultMapApiKey } from './default-map-api-key'; +export { isStaging } from './is-staging'; +export { isMobile } from 'is-mobile'; +export { getInjectedProp } from './get-injected-prop'; +export { isHighlighted } from './is-highlighted'; + +// Used to transfigure the page for the Overlay +import Overlay from './overlay/answers-frame/overlay'; +window.Overlay = new Overlay(); + +// Import code used in Collapsible Filters, and give it the alias of window.CollapsibleFilters. +import CollapsibleFilters from './collapsible-filters'; +export { CollapsibleFilters }; +global.CollapsibleFilters = CollapsibleFilters; + +// Import custom modules which can be accessed from HitchhikerJS.CustomModules +import * as CustomModules from './custom-modules'; +export { CustomModules }; + +import StorageKeys from './constants/storage-keys'; +export { StorageKeys }; + +import transformFacets from './transform-facets'; +export { transformFacets } \ No newline at end of file diff --git a/static/webpack-config.js b/static/webpack-config.js index 979466cae..256d79793 100644 --- a/static/webpack-config.js +++ b/static/webpack-config.js @@ -55,7 +55,7 @@ module.exports = function () { }, target: ['web', 'es5'], entry: { - 'HitchhikerJS': `./${jamboConfig.dirs.output}/static/entry.js`, + 'bundle': `./${jamboConfig.dirs.output}/static/entry.js`, 'iframe': `./${jamboConfig.dirs.output}/static/js/iframe.js`, 'answers': `./${jamboConfig.dirs.output}/static/js/iframe.js`, 'overlay-button': `./${jamboConfig.dirs.output}/static/js/overlay/button-frame/entry.js`, @@ -73,8 +73,7 @@ module.exports = function () { filename: pathData => { const chunkName = pathData.chunk.name; return { - VerticalFullPageMap: 'locator-bundle.js', - HitchhikerJS: 'bundle.js', + VerticalFullPageMap: 'locator-bundle.js' }[chunkName] || '[name].js' }, library: '[name]', @@ -140,12 +139,12 @@ module.exports = function () { if (isDevelopment) { const devConfig = require( `./${jamboConfig.dirs.output}/static/webpack/webpack.dev.js` - )(); + )(jamboConfig); return merge(commonConfig, devConfig); } else { const prodConfig = require( `./${jamboConfig.dirs.output}/static/webpack/webpack.prod.js` - )(); + )(jamboConfig); return merge(commonConfig, prodConfig); } }; diff --git a/static/webpack/webpack.prod.js b/static/webpack/webpack.prod.js index 26ae8ca06..f78a981c6 100644 --- a/static/webpack/webpack.prod.js +++ b/static/webpack/webpack.prod.js @@ -1,10 +1,13 @@ const { ESBuildMinifyPlugin } = require('esbuild-loader') -module.exports = () => { +module.exports = (jamboConfig) => { const InlineAssetHtmlPlugin = require('./InlineAssetHtmlPlugin'); return { mode: 'production', devtool: 'source-map', + entry: { + 'bundle-legacy': `./${jamboConfig.dirs.output}/static/entry-legacy.js`, + }, plugins: [ new InlineAssetHtmlPlugin() ], @@ -42,4 +45,4 @@ module.exports = () => { ] }, }; -} \ No newline at end of file +}