From e97264c9d364b859904bcaf857771610644ea36e Mon Sep 17 00:00:00 2001 From: Wendelin Date: Wed, 30 Oct 2024 14:32:34 +0100 Subject: [PATCH] Change dev build for landing-page --- build-scripts/gulp/landing-page.js | 9 ++--- build-scripts/gulp/webpack.js | 34 +++++++------------ landing-page/README.md | 13 +++++-- .../src/components/landing-page-logs.ts | 2 +- .../src/components/landing-page-network.ts | 4 +-- 5 files changed, 28 insertions(+), 34 deletions(-) diff --git a/build-scripts/gulp/landing-page.js b/build-scripts/gulp/landing-page.js index b54cade42ad6..b958738acad7 100644 --- a/build-scripts/gulp/landing-page.js +++ b/build-scripts/gulp/landing-page.js @@ -1,5 +1,4 @@ import gulp from "gulp"; -import env from "../env.cjs"; import "./clean.js"; import "./entry-html.js"; import "./gather-static.js"; @@ -20,11 +19,7 @@ gulp.task( gulp.parallel("gen-icons-json", "build-translations", "build-locale-data"), "copy-static-landing-page", "gen-pages-landing-page-dev", - gulp.parallel( - env.useRollup() - ? "rollup-dev-server-landing-page" - : "webpack-dev-server-landing-page" - ) + gulp.parallel("webpack-watch-landing-page") ) ); @@ -38,7 +33,7 @@ gulp.task( "translations-enable-merge-backend", gulp.parallel("gen-icons-json", "build-translations", "build-locale-data"), "copy-static-landing-page", - env.useRollup() ? "rollup-prod-landing-page" : "webpack-prod-landing-page", + "webpack-prod-landing-page", "gen-pages-landing-page-prod" ) ); diff --git a/build-scripts/gulp/webpack.js b/build-scripts/gulp/webpack.js index 73562564dbc8..51a6837d6a09 100644 --- a/build-scripts/gulp/webpack.js +++ b/build-scripts/gulp/webpack.js @@ -203,28 +203,18 @@ gulp.task("webpack-prod-gallery", () => ) ); -gulp.task("webpack-dev-server-landing-page", () => - runDevServer({ - compiler: webpack( - process.env.ES5 - ? bothBuilds(createLandingPageConfig, { isProdBuild: false }) - : createLandingPageConfig({ isProdBuild: false, latestBuild: true }) - ), - contentBase: paths.landingPage_output_root, - port: 8110, - listenHost: "0.0.0.0", - proxy: [ - { - context: ["/observer"], - target: "http://localhost:8830", - }, - { - context: ["/supervisor"], - target: "http://localhost:8830", - }, - ], - }) -); +gulp.task("webpack-watch-landing-page", () => { + // This command will run forever because we don't close compiler + webpack( + process.env.ES5 + ? bothBuilds(createLandingPageConfig, { isProdBuild: false }) + : createLandingPageConfig({ isProdBuild: false, latestBuild: true }) + ).watch({ poll: isWsl }, doneHandler()); + gulp.watch( + path.join(paths.translations_src, "en.json"), + gulp.series("build-translations", "copy-translations-app") + ); +}); gulp.task("webpack-prod-landing-page", () => prodBuild( diff --git a/landing-page/README.md b/landing-page/README.md index 6cff998f31e3..f286b886253b 100644 --- a/landing-page/README.md +++ b/landing-page/README.md @@ -19,17 +19,26 @@ In this time the [home-assistant/landingpage](https://github.com/home-assistant/ ## Develop +It is similar to the core frontend dev. + +- frontend repo is building stuff +- landingpage repo can set the frontend repo path and serve the dev frontend + ### landingpage dev server - clone [home-assistant/landingpage](https://github.com/home-assistant/landingpage) +- Add frontend repo as mount to your devcontainer config + - please do not commit this changes, you can remove it after initial dev container build, because the build will keep the options as long as you don't rebuild it. + - `"mounts": ["source=/path/to/hass/frontend,target=/workspaces/frontend,type=bind,consistency=cached"]` - use the dev container - start the dev server with following optional env vars: - `SUPERVISOR_HOST` to have real supervisor data, you can [setup a supervisor remote API access](https://developers.home-assistant.io/docs/supervisor/development/#supervisor-api-access) and set the host of your supervisor. e.g.: `SUPERVISOR_HOST=192.168.0.20:8888` - `SUPERVISOR_TOKEN` the supervisor api token you get from the Remote API proxy Addon Logs - - example: `SUPERVISOR_TOKEN=abc123 SUPERVISOR_HOST=192.168.0.20:8888 go run main.go http.go mdns.go` + - `FRONTEND_PATH` the path inside your container should be `/workspaces/frontend` + - example: `SUPERVISOR_TOKEN=abc123 SUPERVISOR_HOST=192.168.0.20:8888 FRONTEND_PATH=/workspaces/frontend go run main.go http.go mdns.go` + - You can also add this into your devcontainer settings, but then it's not so flexible to change if you want to test something else. ### frontend dev server - install all dependencies - run `landing-page/script/develop` - - The dev server has a proxy activated to landingpage dev server (`http://localhost:8830`) diff --git a/landing-page/src/components/landing-page-logs.ts b/landing-page/src/components/landing-page-logs.ts index 24aebbcc1f3a..ebf1e6ea8c6d 100644 --- a/landing-page/src/components/landing-page-logs.ts +++ b/landing-page/src/components/landing-page-logs.ts @@ -2,7 +2,7 @@ import "@material/mwc-linear-progress/mwc-linear-progress"; import { mdiArrowCollapseDown, mdiDownload } from "@mdi/js"; // eslint-disable-next-line import/extensions import { IntersectionController } from "@lit-labs/observers/intersection-controller.js"; -import { LitElement, PropertyValues, css, html, nothing } from "lit"; +import { LitElement, type PropertyValues, css, html, nothing } from "lit"; import { classMap } from "lit/directives/class-map"; import { customElement, property, query, state } from "lit/decorators"; import type { LocalizeFunc } from "../../../src/common/translations/localize"; diff --git a/landing-page/src/components/landing-page-network.ts b/landing-page/src/components/landing-page-network.ts index 1fd959e2788f..52fd48c4a66c 100644 --- a/landing-page/src/components/landing-page-network.ts +++ b/landing-page/src/components/landing-page-network.ts @@ -1,8 +1,8 @@ import "@material/mwc-linear-progress/mwc-linear-progress"; import { - CSSResultGroup, + type CSSResultGroup, LitElement, - PropertyValues, + type PropertyValues, css, html, nothing,