From 2b1ceb6d0845dd2335a7a36dfe3337d7270cd5a4 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Thu, 2 Sep 2021 16:52:53 -0500 Subject: [PATCH 1/7] Build config: subdirectory support --- app/soapbox/build_config.js | 27 ++++++++++++++++++++++++++- app/soapbox/containers/soapbox.js | 3 ++- 2 files changed, 28 insertions(+), 2 deletions(-) diff --git a/app/soapbox/build_config.js b/app/soapbox/build_config.js index 7dc8cec99..b0fb99cf1 100644 --- a/app/soapbox/build_config.js +++ b/app/soapbox/build_config.js @@ -4,7 +4,13 @@ * @module soapbox/build_config */ -const { BACKEND_URL } = process.env; +const { trimEnd } = require('lodash'); + +const { + BACKEND_URL, + FE_BASE_PATH, + CI_PAGES_URL, +} = process.env; const sanitizeURL = url => { try { @@ -14,10 +20,29 @@ const sanitizeURL = url => { } }; +// Run Soapbox FE from a subdirectory. +// If FE_BASE_PATH (eg '/web') is provided, prefer it. +// For GitLab Pages builds, CI_PAGES_URL will be used. +const getFeBasePath = () => { + if (FE_BASE_PATH) { + return trimEnd(FE_BASE_PATH, '/'); + } else if (CI_PAGES_URL) { + try { + const { pathname } = new URL(CI_PAGES_URL); + return trimEnd(pathname, '/'); + } catch { + return '/'; + } + } else { + return '/'; + } +}; + // JSON.parse/stringify is to emulate what @preval is doing and avoid any // inconsistent behavior in dev mode const sanitize = obj => JSON.parse(JSON.stringify(obj)); module.exports = sanitize({ BACKEND_URL: sanitizeURL(BACKEND_URL), + FE_BASE_PATH: getFeBasePath(), }); diff --git a/app/soapbox/containers/soapbox.js b/app/soapbox/containers/soapbox.js index 8a0c327da..63fe783de 100644 --- a/app/soapbox/containers/soapbox.js +++ b/app/soapbox/containers/soapbox.js @@ -26,6 +26,7 @@ import { getSettings } from 'soapbox/actions/settings'; import { getSoapboxConfig } from 'soapbox/actions/soapbox'; import { generateThemeCss } from 'soapbox/utils/theme'; import messages from 'soapbox/locales/messages'; +import { FE_BASE_PATH } from 'soapbox/build_config'; const validLocale = locale => Object.keys(messages).includes(locale); @@ -142,7 +143,7 @@ class SoapboxMount extends React.PureComponent { ))} - + {!me && } From 446b9b9bb15ef84a31b448e788a3eae9e20823fd Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Thu, 2 Sep 2021 16:57:40 -0500 Subject: [PATCH 2/7] GitLab CI: call `env` before jobs --- .gitlab-ci.yml | 1 + 1 file changed, 1 insertion(+) diff --git a/.gitlab-ci.yml b/.gitlab-ci.yml index c4c7800ba..963e63284 100644 --- a/.gitlab-ci.yml +++ b/.gitlab-ci.yml @@ -17,6 +17,7 @@ stages: - deploy before_script: + - env - yarn lint-js: From 39132d7e0ea0ee892e69c0f7e5488cce917468f3 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Thu, 2 Sep 2021 17:09:42 -0500 Subject: [PATCH 3/7] Don't use CI_PAGES_URL after all --- app/soapbox/build_config.js | 16 +--------------- 1 file changed, 1 insertion(+), 15 deletions(-) diff --git a/app/soapbox/build_config.js b/app/soapbox/build_config.js index b0fb99cf1..f69ecf9fe 100644 --- a/app/soapbox/build_config.js +++ b/app/soapbox/build_config.js @@ -9,7 +9,6 @@ const { trimEnd } = require('lodash'); const { BACKEND_URL, FE_BASE_PATH, - CI_PAGES_URL, } = process.env; const sanitizeURL = url => { @@ -21,21 +20,8 @@ const sanitizeURL = url => { }; // Run Soapbox FE from a subdirectory. -// If FE_BASE_PATH (eg '/web') is provided, prefer it. -// For GitLab Pages builds, CI_PAGES_URL will be used. const getFeBasePath = () => { - if (FE_BASE_PATH) { - return trimEnd(FE_BASE_PATH, '/'); - } else if (CI_PAGES_URL) { - try { - const { pathname } = new URL(CI_PAGES_URL); - return trimEnd(pathname, '/'); - } catch { - return '/'; - } - } else { - return '/'; - } + return trimEnd(FE_BASE_PATH, '/') || '/'; }; // JSON.parse/stringify is to emulate what @preval is doing and avoid any From 30848ae0808efa8ccc4744a16a53abca4d936be4 Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Thu, 2 Sep 2021 17:18:53 -0500 Subject: [PATCH 4/7] FE_BASE_PATH: use `trim` instead of `trimEnd` --- app/soapbox/build_config.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/soapbox/build_config.js b/app/soapbox/build_config.js index f69ecf9fe..53d05170f 100644 --- a/app/soapbox/build_config.js +++ b/app/soapbox/build_config.js @@ -4,7 +4,7 @@ * @module soapbox/build_config */ -const { trimEnd } = require('lodash'); +const { trim } = require('lodash'); const { BACKEND_URL, @@ -21,7 +21,7 @@ const sanitizeURL = url => { // Run Soapbox FE from a subdirectory. const getFeBasePath = () => { - return trimEnd(FE_BASE_PATH, '/') || '/'; + return `/${trim(FE_BASE_PATH, '/')}`; }; // JSON.parse/stringify is to emulate what @preval is doing and avoid any From 66b67440fe2abeccb0c1c389969d7d7d8f3fc5ac Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Fri, 3 Sep 2021 11:50:39 -0500 Subject: [PATCH 5/7] FE_BASE_PATH: set output directory --- webpack/configuration.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/webpack/configuration.js b/webpack/configuration.js index 1e80b65a6..e4bfa3ee1 100644 --- a/webpack/configuration.js +++ b/webpack/configuration.js @@ -1,6 +1,8 @@ const { join } = require('path'); const { env } = require('process'); +const { FE_BASE_PATH } = require(join(__dirname, '..', 'app', 'soapbox', 'build_config')); + const settings = { source_path: 'app', public_root_path: 'static', @@ -14,7 +16,7 @@ const settings = { const outputDir = env.NODE_ENV === 'test' ? settings.test_root_path : settings.public_root_path; const output = { - path: join(__dirname, '..', outputDir), + path: join(__dirname, '..', outputDir, FE_BASE_PATH), }; module.exports = { From 868f514f5bc35f381747f4b1eb1fd3fea2f9866a Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Fri, 3 Sep 2021 13:49:18 -0500 Subject: [PATCH 6/7] Webpack: use FE_BASE_PATH as publicPath --- webpack/shared.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/webpack/shared.js b/webpack/shared.js index f8aca4794..ad790adba 100644 --- a/webpack/shared.js +++ b/webpack/shared.js @@ -11,6 +11,8 @@ const { UnusedFilesWebpackPlugin } = require('unused-files-webpack-plugin'); const { env, settings, output } = require('./configuration'); const rules = require('./rules'); +const { FE_BASE_PATH } = require(join(__dirname, '..', 'app', 'soapbox', 'build_config')); + const htmlWebpackPluginConfig = { template: 'app/index.ejs', chunksSortMode: 'manual', @@ -37,7 +39,7 @@ module.exports = { chunkFilename: 'packs/js/[name]-[chunkhash].chunk.js', hotUpdateChunkFilename: 'packs/js/[id]-[hash].hot-update.js', path: output.path, - publicPath: '/', + publicPath: FE_BASE_PATH, }, optimization: { From 54d7d9c6db4b6b89edaf0902c3c07bafa1a680bc Mon Sep 17 00:00:00 2001 From: Alex Gleason Date: Fri, 3 Sep 2021 14:00:54 -0500 Subject: [PATCH 7/7] Webpack: don't cache build_config with @preval --- webpack/rules/babel-build-config.js | 19 +++++++++++++++++++ webpack/rules/index.js | 2 ++ 2 files changed, 21 insertions(+) create mode 100644 webpack/rules/babel-build-config.js diff --git a/webpack/rules/babel-build-config.js b/webpack/rules/babel-build-config.js new file mode 100644 index 000000000..78e2b47aa --- /dev/null +++ b/webpack/rules/babel-build-config.js @@ -0,0 +1,19 @@ +const { resolve } = require('path'); +const { env } = require('../configuration'); + +// This is a hack, used to force build_config @preval to recompile +// https://github.com/kentcdodds/babel-plugin-preval/issues/19 + +module.exports = { + test: resolve(__dirname, '../../app/soapbox/build_config.js'), + use: [ + { + loader: 'babel-loader', + options: { + cacheDirectory: false, + cacheCompression: env.NODE_ENV === 'production', + compact: env.NODE_ENV === 'production', + }, + }, + ], +}; diff --git a/webpack/rules/index.js b/webpack/rules/index.js index 467b23f22..91a4abd19 100644 --- a/webpack/rules/index.js +++ b/webpack/rules/index.js @@ -1,6 +1,7 @@ const babel = require('./babel'); const git = require('./babel-git'); const gitRefresh = require('./git-refresh'); +const buildConfig = require('./babel-build-config'); const css = require('./css'); const file = require('./file'); const nodeModules = require('./node_modules'); @@ -15,4 +16,5 @@ module.exports = [ babel, git, gitRefresh, + buildConfig, ];