From 2fe86fd86937b47969447d91bb987b7e0233afd5 Mon Sep 17 00:00:00 2001 From: tamaina Date: Tue, 20 Dec 2022 13:05:36 +0900 Subject: enhance: Vite HMR while yarn dev, and more build tuning (#9361) * enhance: Vite HMR while yarn dev, and more build tuning * use localhost Co-authored-by: syuilo --- .../backend/src/server/web/ClientServerService.ts | 22 +++++++++++++++++++--- packages/backend/src/server/web/boot.js | 2 +- packages/backend/src/server/web/views/base.pug | 9 ++++++--- 3 files changed, 26 insertions(+), 7 deletions(-) (limited to 'packages/backend/src/server') diff --git a/packages/backend/src/server/web/ClientServerService.ts b/packages/backend/src/server/web/ClientServerService.ts index 58452ae826..c537d9a369 100644 --- a/packages/backend/src/server/web/ClientServerService.ts +++ b/packages/backend/src/server/web/ClientServerService.ts @@ -12,6 +12,7 @@ import { In, IsNull } from 'typeorm'; import fastifyStatic from '@fastify/static'; import fastifyView from '@fastify/view'; import fastifyCookie from '@fastify/cookie'; +import fastifyProxy from '@fastify/http-proxy'; import type { Config } from '@/config.js'; import { getNoteSummary } from '@/misc/get-note-summary.js'; import { DI } from '@/di-symbols.js'; @@ -39,6 +40,7 @@ const staticAssets = `${_dirname}/../../../assets/`; const clientAssets = `${_dirname}/../../../../client/assets/`; const assets = `${_dirname}/../../../../../built/_client_dist_/`; const swAssets = `${_dirname}/../../../../../built/_sw_dist_/`; +const viteOut = `${_dirname}/../../../../../built/_vite_/`; @Injectable() export class ClientServerService { @@ -151,9 +153,6 @@ export class ClientServerService { }, defaultContext: { version: this.config.version, - getClientEntry: () => process.env.NODE_ENV === 'production' ? - this.config.clientEntry : - JSON.parse(readFileSync(`${_dirname}/../../../../../built/_client_dist_/manifest.json`, 'utf-8'))['src/init.ts'], config: this.config, }, }); @@ -164,6 +163,23 @@ export class ClientServerService { done(); }); + //#region vite assets + if (this.config.clientManifestExists) { + fastify.register(fastifyStatic, { + root: viteOut, + prefix: '/vite/', + maxAge: ms('30 days'), + decorateReply: false, + }); + } else { + fastify.register(fastifyProxy, { + upstream: 'http://localhost:5173', // TODO: port configuration + prefix: '/vite', + rewritePrefix: '/vite', + }); + } + //#endregion + //#region static assets fastify.register(fastifyStatic, { diff --git a/packages/backend/src/server/web/boot.js b/packages/backend/src/server/web/boot.js index ffd8b8941c..86df3308ec 100644 --- a/packages/backend/src/server/web/boot.js +++ b/packages/backend/src/server/web/boot.js @@ -57,7 +57,7 @@ //#region Script function importAppScript() { - import(`/assets/${CLIENT_ENTRY}`) + import(`/vite/${CLIENT_ENTRY}`) .catch(async e => { await checkUpdate(); console.error(e); diff --git a/packages/backend/src/server/web/views/base.pug b/packages/backend/src/server/web/views/base.pug index 1b3ac82d2e..0c3c5c9b7e 100644 --- a/packages/backend/src/server/web/views/base.pug +++ b/packages/backend/src/server/web/views/base.pug @@ -1,7 +1,7 @@ block vars block loadClientEntry - - const clientEntry = getClientEntry(); + - const clientEntry = config.clientEntry; doctype html @@ -35,11 +35,14 @@ html link(rel='prefetch' href='https://xn--931a.moe/assets/not-found.jpg') link(rel='prefetch' href='https://xn--931a.moe/assets/error.jpg') link(rel='stylesheet' href='/assets/tabler-icons/tabler-icons.css') - link(rel='modulepreload' href=`/assets/${clientEntry.file}`) + link(rel='modulepreload' href=`/vite/${clientEntry.file}`) + + if !config.clientManifestExists + script(type="module" src="/vite/@vite/client") if Array.isArray(clientEntry.css) each href in clientEntry.css - link(rel='stylesheet' href=`/assets/${href}`) + link(rel='stylesheet' href=`/vite/${href}`) title block title -- cgit v1.2.3-freya