From aaf9bc970c5e34d7a5d6780f172fc2983a78f67e Mon Sep 17 00:00:00 2001 From: SleeplessOne1917 Date: Wed, 28 Jun 2023 22:22:06 -0400 Subject: [PATCH 1/7] Use git hash to break cache --- .prettierignore | 1 + Dockerfile | 2 +- dev.dockerfile | 4 +++- src/server/index.tsx | 3 ++- src/server/utils/create-ssr-html.tsx | 5 +++-- src/shared/components/common/icon.tsx | 3 ++- src/shared/components/person/person-listing.tsx | 5 ++++- src/shared/config.ts | 6 ++++-- src/shared/version.ts | 1 + webpack.config.js | 8 +++++++- 10 files changed, 28 insertions(+), 10 deletions(-) diff --git a/.prettierignore b/.prettierignore index 004c815..e9ba8f6 100644 --- a/.prettierignore +++ b/.prettierignore @@ -2,3 +2,4 @@ src/shared/translations lemmy-translations src/assets/css/themes/*.css stats.json +dist \ No newline at end of file diff --git a/Dockerfile b/Dockerfile index 2b36581..66a0add 100644 --- a/Dockerfile +++ b/Dockerfile @@ -24,7 +24,7 @@ COPY src src COPY .git .git # Set UI version -RUN echo "export const VERSION = '$(git describe --tag)';" > "src/shared/version.ts" +RUN echo "export const VERSION = '$(git describe --tag)'; export const COMMIT_HASH = '$(git rev-parse HEAD)';" > "src/shared/version.ts" RUN yarn --production --prefer-offline RUN yarn build:prod diff --git a/dev.dockerfile b/dev.dockerfile index 3bfc10d..e446ba8 100644 --- a/dev.dockerfile +++ b/dev.dockerfile @@ -18,11 +18,13 @@ COPY generate_translations.js \ .babelrc \ ./ + COPY lemmy-translations lemmy-translations COPY src src +COPY .git .git # Set UI version -RUN echo "export const VERSION = 'dev';" > "src/shared/version.ts" +RUN echo "export const VERSION = 'dev'; export const COMMIT_HASH = '$(git rev-parse HEAD)';" > "src/shared/version.ts" RUN yarn --prefer-offline RUN yarn build:dev diff --git a/src/server/index.tsx b/src/server/index.tsx index aed8bca..5dd8303 100644 --- a/src/server/index.tsx +++ b/src/server/index.tsx @@ -2,6 +2,7 @@ import { setupDateFns } from "@utils/app"; import express from "express"; import path from "path"; import process from "process"; +import { COMMIT_HASH } from "../shared/version"; import CatchAllHandler from "./handlers/catch-all-handler"; import ManifestHandler from "./handlers/manifest-handler"; import RobotsHandler from "./handlers/robots-handler"; @@ -18,7 +19,7 @@ const [hostname, port] = process.env["LEMMY_UI_HOST"] server.use(express.json()); server.use(express.urlencoded({ extended: false })); -server.use("/static", express.static(path.resolve("./dist"))); +server.use(`/static-${COMMIT_HASH}`, express.static(path.resolve("./dist"))); server.use(setCacheControl); if (!process.env["LEMMY_UI_DISABLE_CSP"] && !process.env["LEMMY_UI_DEBUG"]) { diff --git a/src/server/utils/create-ssr-html.tsx b/src/server/utils/create-ssr-html.tsx index 1377598..d77df26 100644 --- a/src/server/utils/create-ssr-html.tsx +++ b/src/server/utils/create-ssr-html.tsx @@ -4,6 +4,7 @@ import serialize from "serialize-javascript"; import sharp from "sharp"; import { favIconPngUrl, favIconUrl } from "../../shared/config"; import { ILemmyConfig, IsoDataOptionalSite } from "../../shared/interfaces"; +import { COMMIT_HASH } from "../../shared/version"; import { buildThemeList } from "./build-themes-list"; import { fetchIconPng } from "./fetch-icon-png"; @@ -87,7 +88,7 @@ export async function createSsrHtml( - + ${helmet.link.toString() || fallbackTheme} @@ -102,7 +103,7 @@ export async function createSsrHtml(
${root}
- + `; diff --git a/src/shared/components/common/icon.tsx b/src/shared/components/common/icon.tsx index 5b6ddf8..7060e9c 100644 --- a/src/shared/components/common/icon.tsx +++ b/src/shared/components/common/icon.tsx @@ -1,5 +1,6 @@ import classNames from "classnames"; import { Component } from "inferno"; +import { COMMIT_HASH } from "../../../shared/version"; import { I18NextService } from "../../services"; interface IconProps { @@ -23,7 +24,7 @@ export class Icon extends Component { })} >
{this.props.icon} diff --git a/src/shared/components/person/person-listing.tsx b/src/shared/components/person/person-listing.tsx index 6631a8e..a8fc0da 100644 --- a/src/shared/components/person/person-listing.tsx +++ b/src/shared/components/person/person-listing.tsx @@ -4,6 +4,7 @@ import classNames from "classnames"; import { Component } from "inferno"; import { Link } from "inferno-router"; import { Person } from "lemmy-js-client"; +import { COMMIT_HASH } from "../../../shared/version"; import { relTags } from "../../config"; import { PictrsImage } from "../common/pictrs-image"; import { CakeDay } from "./cake-day"; @@ -88,7 +89,9 @@ export class PersonListing extends Component { !this.props.person.banned && showAvatars() && ( )} diff --git a/src/shared/config.ts b/src/shared/config.ts index 97b28d2..6b0a190 100644 --- a/src/shared/config.ts +++ b/src/shared/config.ts @@ -1,5 +1,7 @@ -export const favIconUrl = "/static/assets/icons/favicon.svg"; -export const favIconPngUrl = "/static/assets/icons/apple-touch-icon.png"; +import { COMMIT_HASH } from "./version"; + +export const favIconUrl = `/static-${COMMIT_HASH}/assets/icons/favicon.svg`; +export const favIconPngUrl = `/static-${COMMIT_HASH}/assets/icons/apple-touch-icon.png`; export const repoUrl = "https://github.com/LemmyNet"; export const joinLemmyUrl = "https://join-lemmy.org"; diff --git a/src/shared/version.ts b/src/shared/version.ts index c1dba35..a799956 100644 --- a/src/shared/version.ts +++ b/src/shared/version.ts @@ -1 +1,2 @@ export const VERSION = "unknown version"; +export const COMMIT_HASH = "unknown hash"; diff --git a/webpack.config.js b/webpack.config.js index 4d95a80..268d9ec 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -14,6 +14,11 @@ const banner = ` @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL v3.0 `; +const commitHash = require("child_process") + .execSync("git rev-parse HEAD") + .toString() + .trim(); + const base = { output: { filename: "js/server.js", @@ -96,6 +101,7 @@ const createClientConfig = (_env, mode) => { entry: "./src/client/index.tsx", output: { filename: "js/client.js", + publicPath: `/static-${commitHash}`, }, plugins: [ ...base.plugins, @@ -103,7 +109,7 @@ const createClientConfig = (_env, mode) => { enableInDevelopment: mode !== "development", // this may seem counterintuitive, but it is correct workbox: { modifyURLPrefix: { - "/": "/static/", + "/": `/static-${commitHash}/`, }, cacheId: "lemmy", include: [/(assets|styles)\/.+\..+|client\.js$/g], From c7ea1b7c56df3b12ec18761b8932fe0f5ca9c21c Mon Sep 17 00:00:00 2001 From: SleeplessOne1917 Date: Thu, 29 Jun 2023 06:18:31 -0400 Subject: [PATCH 2/7] Address PR feedback --- src/server/index.tsx | 2 +- src/server/utils/create-ssr-html.tsx | 4 ++-- src/shared/components/common/icon.tsx | 2 +- src/shared/components/person/person-listing.tsx | 2 +- src/shared/config.ts | 4 ++-- webpack.config.js | 4 ++-- 6 files changed, 9 insertions(+), 9 deletions(-) diff --git a/src/server/index.tsx b/src/server/index.tsx index 5dd8303..e9c907f 100644 --- a/src/server/index.tsx +++ b/src/server/index.tsx @@ -19,7 +19,7 @@ const [hostname, port] = process.env["LEMMY_UI_HOST"] server.use(express.json()); server.use(express.urlencoded({ extended: false })); -server.use(`/static-${COMMIT_HASH}`, express.static(path.resolve("./dist"))); +server.use(`/static/${COMMIT_HASH}`, express.static(path.resolve("./dist"))); server.use(setCacheControl); if (!process.env["LEMMY_UI_DISABLE_CSP"] && !process.env["LEMMY_UI_DEBUG"]) { diff --git a/src/server/utils/create-ssr-html.tsx b/src/server/utils/create-ssr-html.tsx index d77df26..0a4ec22 100644 --- a/src/server/utils/create-ssr-html.tsx +++ b/src/server/utils/create-ssr-html.tsx @@ -88,7 +88,7 @@ export async function createSsrHtml( - + ${helmet.link.toString() || fallbackTheme} @@ -103,7 +103,7 @@ export async function createSsrHtml(
${root}
- + `; diff --git a/src/shared/components/common/icon.tsx b/src/shared/components/common/icon.tsx index 7060e9c..10f59c7 100644 --- a/src/shared/components/common/icon.tsx +++ b/src/shared/components/common/icon.tsx @@ -24,7 +24,7 @@ export class Icon extends Component { })} >
{this.props.icon} diff --git a/src/shared/components/person/person-listing.tsx b/src/shared/components/person/person-listing.tsx index a8fc0da..169a93f 100644 --- a/src/shared/components/person/person-listing.tsx +++ b/src/shared/components/person/person-listing.tsx @@ -90,7 +90,7 @@ export class PersonListing extends Component { showAvatars() && ( diff --git a/src/shared/config.ts b/src/shared/config.ts index 6b0a190..cb0f8e1 100644 --- a/src/shared/config.ts +++ b/src/shared/config.ts @@ -1,7 +1,7 @@ import { COMMIT_HASH } from "./version"; -export const favIconUrl = `/static-${COMMIT_HASH}/assets/icons/favicon.svg`; -export const favIconPngUrl = `/static-${COMMIT_HASH}/assets/icons/apple-touch-icon.png`; +export const favIconUrl = `/static/${COMMIT_HASH}/assets/icons/favicon.svg`; +export const favIconPngUrl = `/static/${COMMIT_HASH}/assets/icons/apple-touch-icon.png`; export const repoUrl = "https://github.com/LemmyNet"; export const joinLemmyUrl = "https://join-lemmy.org"; diff --git a/webpack.config.js b/webpack.config.js index 268d9ec..0b03f6d 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -101,7 +101,7 @@ const createClientConfig = (_env, mode) => { entry: "./src/client/index.tsx", output: { filename: "js/client.js", - publicPath: `/static-${commitHash}`, + publicPath: `/static/${commitHash}`, }, plugins: [ ...base.plugins, @@ -109,7 +109,7 @@ const createClientConfig = (_env, mode) => { enableInDevelopment: mode !== "development", // this may seem counterintuitive, but it is correct workbox: { modifyURLPrefix: { - "/": `/static-${commitHash}/`, + "/": `/static/${commitHash}/`, }, cacheId: "lemmy", include: [/(assets|styles)\/.+\..+|client\.js$/g], From 753953ad3eff19c5535689422adf3f2048d0499a Mon Sep 17 00:00:00 2001 From: SleeplessOne1917 Date: Thu, 29 Jun 2023 09:25:08 -0400 Subject: [PATCH 3/7] Make hash docker agnostic --- Dockerfile | 2 +- dev.dockerfile | 3 +- package.json | 4 +- src/server/index.tsx | 7 +- src/server/utils/create-ssr-html.tsx | 9 +- src/shared/components/common/icon.tsx | 3 +- .../components/person/person-listing.tsx | 4 +- src/shared/config.ts | 6 +- src/shared/version.ts | 1 - webpack.config.js | 108 +++++++++--------- 10 files changed, 75 insertions(+), 72 deletions(-) diff --git a/Dockerfile b/Dockerfile index 66a0add..2b36581 100644 --- a/Dockerfile +++ b/Dockerfile @@ -24,7 +24,7 @@ COPY src src COPY .git .git # Set UI version -RUN echo "export const VERSION = '$(git describe --tag)'; export const COMMIT_HASH = '$(git rev-parse HEAD)';" > "src/shared/version.ts" +RUN echo "export const VERSION = '$(git describe --tag)';" > "src/shared/version.ts" RUN yarn --production --prefer-offline RUN yarn build:prod diff --git a/dev.dockerfile b/dev.dockerfile index e446ba8..881d9bc 100644 --- a/dev.dockerfile +++ b/dev.dockerfile @@ -18,13 +18,12 @@ COPY generate_translations.js \ .babelrc \ ./ - COPY lemmy-translations lemmy-translations COPY src src COPY .git .git # Set UI version -RUN echo "export const VERSION = 'dev'; export const COMMIT_HASH = '$(git rev-parse HEAD)';" > "src/shared/version.ts" +RUN echo "export const VERSION = 'dev';" > "src/shared/version.ts" RUN yarn --prefer-offline RUN yarn build:dev diff --git a/package.json b/package.json index e5c1fa7..fcac4e1 100644 --- a/package.json +++ b/package.json @@ -8,9 +8,9 @@ "scripts": { "analyze": "webpack --mode=none", "prebuild:dev": "yarn clean && node generate_translations.js", - "build:dev": "webpack --mode=development", + "build:dev": "webpack --env COMMIT_HASH=$(git rev-parse --short HEAD) --mode=development", "prebuild:prod": "yarn clean && node generate_translations.js", - "build:prod": "webpack --mode=production", + "build:prod": "webpack --env COMMIT_HASH=$(git rev-parse --short HEAD) --mode=production", "clean": "yarn run rimraf dist", "dev": "yarn build:dev --watch", "lint": "yarn translations:generate && tsc --noEmit && eslint --report-unused-disable-directives --ext .js,.ts,.tsx \"src/**\" && prettier --check \"src/**/*.{ts,tsx,js,css,scss}\"", diff --git a/src/server/index.tsx b/src/server/index.tsx index e9c907f..c6af347 100644 --- a/src/server/index.tsx +++ b/src/server/index.tsx @@ -2,7 +2,6 @@ import { setupDateFns } from "@utils/app"; import express from "express"; import path from "path"; import process from "process"; -import { COMMIT_HASH } from "../shared/version"; import CatchAllHandler from "./handlers/catch-all-handler"; import ManifestHandler from "./handlers/manifest-handler"; import RobotsHandler from "./handlers/robots-handler"; @@ -19,7 +18,10 @@ const [hostname, port] = process.env["LEMMY_UI_HOST"] server.use(express.json()); server.use(express.urlencoded({ extended: false })); -server.use(`/static/${COMMIT_HASH}`, express.static(path.resolve("./dist"))); +server.use( + `/static/${process.env.COMMIT_HASH}`, + express.static(path.resolve("./dist")) +); server.use(setCacheControl); if (!process.env["LEMMY_UI_DISABLE_CSP"] && !process.env["LEMMY_UI_DEBUG"]) { @@ -34,6 +36,7 @@ server.get("/css/themelist", ThemesListHandler); server.get("/*", CatchAllHandler); server.listen(Number(port), hostname, () => { + console.log(`HASH: ${process.env.COMMIT_HASH}`); setupDateFns(); console.log(`http://${hostname}:${port}`); }); diff --git a/src/server/utils/create-ssr-html.tsx b/src/server/utils/create-ssr-html.tsx index 0a4ec22..014d325 100644 --- a/src/server/utils/create-ssr-html.tsx +++ b/src/server/utils/create-ssr-html.tsx @@ -4,7 +4,6 @@ import serialize from "serialize-javascript"; import sharp from "sharp"; import { favIconPngUrl, favIconUrl } from "../../shared/config"; import { ILemmyConfig, IsoDataOptionalSite } from "../../shared/interfaces"; -import { COMMIT_HASH } from "../../shared/version"; import { buildThemeList } from "./build-themes-list"; import { fetchIconPng } from "./fetch-icon-png"; @@ -88,7 +87,9 @@ export async function createSsrHtml( - + ${helmet.link.toString() || fallbackTheme} @@ -103,7 +104,9 @@ export async function createSsrHtml(
${root}
- + `; diff --git a/src/shared/components/common/icon.tsx b/src/shared/components/common/icon.tsx index 10f59c7..4102e7b 100644 --- a/src/shared/components/common/icon.tsx +++ b/src/shared/components/common/icon.tsx @@ -1,6 +1,5 @@ import classNames from "classnames"; import { Component } from "inferno"; -import { COMMIT_HASH } from "../../../shared/version"; import { I18NextService } from "../../services"; interface IconProps { @@ -24,7 +23,7 @@ export class Icon extends Component { })} >
{this.props.icon} diff --git a/src/shared/components/person/person-listing.tsx b/src/shared/components/person/person-listing.tsx index 169a93f..1d88e38 100644 --- a/src/shared/components/person/person-listing.tsx +++ b/src/shared/components/person/person-listing.tsx @@ -4,7 +4,6 @@ import classNames from "classnames"; import { Component } from "inferno"; import { Link } from "inferno-router"; import { Person } from "lemmy-js-client"; -import { COMMIT_HASH } from "../../../shared/version"; import { relTags } from "../../config"; import { PictrsImage } from "../common/pictrs-image"; import { CakeDay } from "./cake-day"; @@ -90,7 +89,8 @@ export class PersonListing extends Component { showAvatars() && ( diff --git a/src/shared/config.ts b/src/shared/config.ts index cb0f8e1..3687e60 100644 --- a/src/shared/config.ts +++ b/src/shared/config.ts @@ -1,7 +1,5 @@ -import { COMMIT_HASH } from "./version"; - -export const favIconUrl = `/static/${COMMIT_HASH}/assets/icons/favicon.svg`; -export const favIconPngUrl = `/static/${COMMIT_HASH}/assets/icons/apple-touch-icon.png`; +export const favIconUrl = `/static/${process.env.COMMIT_HASH}/assets/icons/favicon.svg`; +export const favIconPngUrl = `/static/${process.env.COMMIT_HASH}/assets/icons/apple-touch-icon.png`; export const repoUrl = "https://github.com/LemmyNet"; export const joinLemmyUrl = "https://join-lemmy.org"; diff --git a/src/shared/version.ts b/src/shared/version.ts index a799956..c1dba35 100644 --- a/src/shared/version.ts +++ b/src/shared/version.ts @@ -1,2 +1 @@ export const VERSION = "unknown version"; -export const COMMIT_HASH = "unknown hash"; diff --git a/webpack.config.js b/webpack.config.js index 0b03f6d..8acd71a 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -14,61 +14,62 @@ const banner = ` @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL v3.0 `; -const commitHash = require("child_process") - .execSync("git rev-parse HEAD") - .toString() - .trim(); - -const base = { - output: { - filename: "js/server.js", - publicPath: "/", - hashFunction: "xxhash64", - }, - resolve: { - extensions: [".js", ".jsx", ".ts", ".tsx"], - alias: { - "@": path.resolve(__dirname, "src/"), - "@utils": path.resolve(__dirname, "src/shared/utils/"), +function getBase(env) { + return { + output: { + filename: "js/server.js", + publicPath: "/", + hashFunction: "xxhash64", }, - }, - performance: { - hints: false, - }, - module: { - rules: [ - { - test: /\.(scss|css)$/i, - use: [MiniCssExtractPlugin.loader, "css-loader", "sass-loader"], + resolve: { + extensions: [".js", ".jsx", ".ts", ".tsx"], + alias: { + "@": path.resolve(__dirname, "src/"), + "@utils": path.resolve(__dirname, "src/shared/utils/"), }, - { - test: /\.(js|jsx|tsx|ts)$/, // All ts and tsx files will be process by - exclude: /node_modules/, // ignore node_modules - loader: "babel-loader", - }, - // Due to some weird babel issue: https://github.com/webpack/webpack/issues/11467 - { - test: /\.m?js/, - resolve: { - fullySpecified: false, + }, + performance: { + hints: false, + }, + module: { + rules: [ + { + test: /\.(scss|css)$/i, + use: [MiniCssExtractPlugin.loader, "css-loader", "sass-loader"], }, - }, + { + test: /\.(js|jsx|tsx|ts)$/, // All ts and tsx files will be process by + exclude: /node_modules/, // ignore node_modules + loader: "babel-loader", + }, + // Due to some weird babel issue: https://github.com/webpack/webpack/issues/11467 + { + test: /\.m?js/, + resolve: { + fullySpecified: false, + }, + }, + ], + }, + plugins: [ + new webpack.DefinePlugin({ + "process.env.COMMIT_HASH": `"${env.COMMIT_HASH}"`, + }), + new MiniCssExtractPlugin({ + filename: "styles/styles.css", + }), + new CopyPlugin({ + patterns: [{ from: "./src/assets", to: "./assets" }], + }), + new webpack.BannerPlugin({ + banner, + }), ], - }, - plugins: [ - new MiniCssExtractPlugin({ - filename: "styles/styles.css", - }), - new CopyPlugin({ - patterns: [{ from: "./src/assets", to: "./assets" }], - }), - new webpack.BannerPlugin({ - banner, - }), - ], -}; + }; +} -const createServerConfig = (_env, mode) => { +const createServerConfig = (env, mode) => { + const base = getBase(env); const config = merge({}, base, { mode, entry: "./src/server/index.tsx", @@ -95,13 +96,14 @@ const createServerConfig = (_env, mode) => { return config; }; -const createClientConfig = (_env, mode) => { +const createClientConfig = (env, mode) => { + const base = getBase(env); const config = merge({}, base, { mode, entry: "./src/client/index.tsx", output: { filename: "js/client.js", - publicPath: `/static/${commitHash}`, + publicPath: `/static/${env.COMMIT_HASH}`, }, plugins: [ ...base.plugins, @@ -109,7 +111,7 @@ const createClientConfig = (_env, mode) => { enableInDevelopment: mode !== "development", // this may seem counterintuitive, but it is correct workbox: { modifyURLPrefix: { - "/": `/static/${commitHash}/`, + "/": `/static/${env.COMMIT_HASH}/`, }, cacheId: "lemmy", include: [/(assets|styles)\/.+\..+|client\.js$/g], From 6d74f86bd069e55064703cfc91fa4ecd015a8365 Mon Sep 17 00:00:00 2001 From: SleeplessOne1917 Date: Thu, 29 Jun 2023 09:34:38 -0400 Subject: [PATCH 4/7] Add trailing slash --- webpack.config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/webpack.config.js b/webpack.config.js index cea29b1..9afdb52 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -103,7 +103,7 @@ const createClientConfig = (env, mode) => { entry: "./src/client/index.tsx", output: { filename: "js/client.js", - publicPath: `/static/${env.COMMIT_HASH}`, + publicPath: `/static/${env.COMMIT_HASH}/`, }, plugins: [ ...base.plugins, From c24417b9e9401be90e7c10d097c28faaa4889d2d Mon Sep 17 00:00:00 2001 From: SleeplessOne1917 Date: Thu, 29 Jun 2023 09:35:23 -0400 Subject: [PATCH 5/7] Update .prettierignore Co-authored-by: Alec Armbruster <35377827+alectrocute@users.noreply.github.com> --- .prettierignore | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.prettierignore b/.prettierignore index e9ba8f6..c6145fd 100644 --- a/.prettierignore +++ b/.prettierignore @@ -2,4 +2,4 @@ src/shared/translations lemmy-translations src/assets/css/themes/*.css stats.json -dist \ No newline at end of file +dist From 25f65ba6c88427ae901842e55035a68957b06cab Mon Sep 17 00:00:00 2001 From: SleeplessOne1917 Date: Thu, 29 Jun 2023 09:39:38 -0400 Subject: [PATCH 6/7] Remove debugging log --- src/server/index.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/server/index.tsx b/src/server/index.tsx index d712132..cd4e39c 100644 --- a/src/server/index.tsx +++ b/src/server/index.tsx @@ -38,7 +38,6 @@ server.get("/css/themelist", ThemesListHandler); server.get("/*", CatchAllHandler); server.listen(Number(port), hostname, () => { - console.log(`HASH: ${process.env.COMMIT_HASH}`); setupDateFns(); console.log(`http://${hostname}:${port}`); }); From ce5743f17c774be5b8fcf8d5b84f981f62bdfaa8 Mon Sep 17 00:00:00 2001 From: Alec Armbruster <35377827+alectrocute@users.noreply.github.com> Date: Thu, 29 Jun 2023 10:08:12 -0400 Subject: [PATCH 7/7] implement getStaticDir util --- src/server/index.tsx | 6 ++---- src/server/utils/create-ssr-html.tsx | 9 +++------ src/shared/components/common/icon.tsx | 5 ++++- src/shared/components/person/person-listing.tsx | 6 ++---- src/shared/config.ts | 6 ++++-- src/shared/utils/env/get-static-dir.ts | 5 +++++ src/shared/utils/env/index.ts | 2 ++ 7 files changed, 22 insertions(+), 17 deletions(-) create mode 100644 src/shared/utils/env/get-static-dir.ts diff --git a/src/server/index.tsx b/src/server/index.tsx index cd4e39c..e1b36e2 100644 --- a/src/server/index.tsx +++ b/src/server/index.tsx @@ -1,4 +1,5 @@ import { setupDateFns } from "@utils/app"; +import { getStaticDir } from "@utils/env"; import express from "express"; import path from "path"; import process from "process"; @@ -19,10 +20,7 @@ const [hostname, port] = process.env["LEMMY_UI_HOST"] server.use(express.json()); server.use(express.urlencoded({ extended: false })); -server.use( - `/static/${process.env.COMMIT_HASH}`, - express.static(path.resolve("./dist")) -); +server.use(getStaticDir(), express.static(path.resolve("./dist"))); server.use(setCacheControl); if (!process.env["LEMMY_UI_DISABLE_CSP"] && !process.env["LEMMY_UI_DEBUG"]) { diff --git a/src/server/utils/create-ssr-html.tsx b/src/server/utils/create-ssr-html.tsx index 014d325..f6d46b0 100644 --- a/src/server/utils/create-ssr-html.tsx +++ b/src/server/utils/create-ssr-html.tsx @@ -1,3 +1,4 @@ +import { getStaticDir } from "@utils/env"; import { Helmet } from "inferno-helmet"; import { renderToString } from "inferno-server"; import serialize from "serialize-javascript"; @@ -87,9 +88,7 @@ export async function createSsrHtml( - + ${helmet.link.toString() || fallbackTheme} @@ -104,9 +103,7 @@ export async function createSsrHtml(
${root}
- + `; diff --git a/src/shared/components/common/icon.tsx b/src/shared/components/common/icon.tsx index 4102e7b..92a41a3 100644 --- a/src/shared/components/common/icon.tsx +++ b/src/shared/components/common/icon.tsx @@ -1,3 +1,4 @@ +import { getStaticDir } from "@utils/env"; import classNames from "classnames"; import { Component } from "inferno"; import { I18NextService } from "../../services"; @@ -23,7 +24,9 @@ export class Icon extends Component { })} >
{this.props.icon} diff --git a/src/shared/components/person/person-listing.tsx b/src/shared/components/person/person-listing.tsx index 1d88e38..dfc5d66 100644 --- a/src/shared/components/person/person-listing.tsx +++ b/src/shared/components/person/person-listing.tsx @@ -1,4 +1,5 @@ import { showAvatars } from "@utils/app"; +import { getStaticDir } from "@utils/env"; import { hostname, isCakeDay } from "@utils/helpers"; import classNames from "classnames"; import { Component } from "inferno"; @@ -88,10 +89,7 @@ export class PersonListing extends Component { !this.props.person.banned && showAvatars() && ( )} diff --git a/src/shared/config.ts b/src/shared/config.ts index 3687e60..58ecc08 100644 --- a/src/shared/config.ts +++ b/src/shared/config.ts @@ -1,5 +1,7 @@ -export const favIconUrl = `/static/${process.env.COMMIT_HASH}/assets/icons/favicon.svg`; -export const favIconPngUrl = `/static/${process.env.COMMIT_HASH}/assets/icons/apple-touch-icon.png`; +import { getStaticDir } from "@utils/env"; + +export const favIconUrl = `${getStaticDir()}/assets/icons/favicon.svg`; +export const favIconPngUrl = `${getStaticDir()}/assets/icons/apple-touch-icon.png`; export const repoUrl = "https://github.com/LemmyNet"; export const joinLemmyUrl = "https://join-lemmy.org"; diff --git a/src/shared/utils/env/get-static-dir.ts b/src/shared/utils/env/get-static-dir.ts new file mode 100644 index 0000000..1d19596 --- /dev/null +++ b/src/shared/utils/env/get-static-dir.ts @@ -0,0 +1,5 @@ +// Returns path to static directory, intended +// for cache-busting based on latest commit hash. +export default function getStaticDir() { + return `/static/${process.env.COMMIT_HASH}`; +} diff --git a/src/shared/utils/env/index.ts b/src/shared/utils/env/index.ts index e14c673..3a9a3fe 100644 --- a/src/shared/utils/env/index.ts +++ b/src/shared/utils/env/index.ts @@ -6,6 +6,7 @@ import getHttpBaseExternal from "./get-http-base-external"; import getHttpBaseInternal from "./get-http-base-internal"; import getInternalHost from "./get-internal-host"; import getSecure from "./get-secure"; +import getStaticDir from "./get-static-dir"; import httpExternalPath from "./http-external-path"; import isHttps from "./is-https"; @@ -18,6 +19,7 @@ export { getHttpBaseInternal, getInternalHost, getSecure, + getStaticDir, httpExternalPath, isHttps, };