From ea6d7e86f14e1a2fa548c6b02d4e2a2c732a3e79 Mon Sep 17 00:00:00 2001
From: Niko <info@parlepeuple.fr>
Date: Mon, 29 May 2023 01:02:01 +0300
Subject: [PATCH] adding ng-app-web target
---
ng-app-native/.gitignore | 1 +
ng-app-native/package.json | 3 ++
ng-app-native/pnpm-lock.yaml | 10 ++++++
ng-app-native/src/lib/Greet.svelte | 27 ++++++++++------
ng-app-native/src/routes/Home.svelte | 47 ++++++++++++++++------------
ng-app-native/src/routes/Test.svelte | 2 +-
ng-app-native/vite.config.ts | 9 +++---
7 files changed, 65 insertions(+), 34 deletions(-)
diff --git a/ng-app-native/.gitignore b/ng-app-native/.gitignore
index a547bf36..a49d34c0 100644
--- a/ng-app-native/.gitignore
+++ b/ng-app-native/.gitignore
@@ -9,6 +9,7 @@ lerna-debug.log*
node_modules
dist
+dist-web
dist-ssr
*.local
diff --git a/ng-app-native/package.json b/ng-app-native/package.json
index 0405ff1b..5394766f 100644
--- a/ng-app-native/package.json
+++ b/ng-app-native/package.json
@@ -5,6 +5,8 @@
"type": "module",
"scripts": {
"dev": "vite",
+ "webdev": "cross-env NG_APP_WEB=1 TAURI_DEBUG=1 vite",
+ "webbuild": "cross-env NG_APP_WEB=1 vite build",
"build": "vite build",
"preview": "vite preview",
"check": "svelte-check --tsconfig ./tsconfig.json",
@@ -24,6 +26,7 @@
"@tsconfig/svelte": "^3.0.0",
"@types/node": "^18.7.10",
"autoprefixer": "^10.4.14",
+ "cross-env": "^7.0.3",
"internal-ip": "^7.0.0",
"postcss": "^8.4.23",
"postcss-load-config": "^4.0.1",
diff --git a/ng-app-native/pnpm-lock.yaml b/ng-app-native/pnpm-lock.yaml
index 1fe4f571..bed661fd 100644
--- a/ng-app-native/pnpm-lock.yaml
+++ b/ng-app-native/pnpm-lock.yaml
@@ -9,6 +9,7 @@ specifiers:
'@types/node': ^18.7.10
autoprefixer: ^10.4.14
classnames: ^2.3.2
+ cross-env: ^7.0.3
flowbite: ^1.6.5
flowbite-svelte: ^0.37.1
internal-ip: ^7.0.0
@@ -37,6 +38,7 @@ devDependencies:
'@tsconfig/svelte': 3.0.0
'@types/node': 18.16.13
autoprefixer: 10.4.14_postcss@8.4.23
+ cross-env: 7.0.3
internal-ip: 7.0.0
postcss: 8.4.23
postcss-load-config: 4.0.1_postcss@8.4.23
@@ -557,6 +559,14 @@ packages:
resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
dev: true
+ /cross-env/7.0.3:
+ resolution: {integrity: sha512-+/HKd6EgcQCJGh2PSjZuUitQBQynKor4wrFbRg4DtAgS1aWO+gU52xpH7M9ScGgXSYmAVS9bIJ8EzuaGw0oNAw==}
+ engines: {node: '>=10.14', npm: '>=6', yarn: '>=1'}
+ hasBin: true
+ dependencies:
+ cross-spawn: 7.0.3
+ dev: true
+
/cross-spawn/7.0.3:
resolution: {integrity: sha512-iRDPJKUPVEND7dHPO8rkbOnPpyDygcDFtWjpeWNCgy8WP2rXcxXL8TskReQl6OrB2G7+UJrags1q15Fudc7G6w==}
engines: {node: '>= 8'}
diff --git a/ng-app-native/src/lib/Greet.svelte b/ng-app-native/src/lib/Greet.svelte
index 05c46ef3..b96dbaf0 100644
--- a/ng-app-native/src/lib/Greet.svelte
+++ b/ng-app-native/src/lib/Greet.svelte
@@ -1,21 +1,30 @@
<script lang="ts">
- import { invoke } from "@tauri-apps/api/tauri"
-
let name = "";
- let greetMsg = ""
+ let greetMsg = "";
+ let ng;
+
+ if (import.meta.env.NG_APP_WEB) {
+ ng = {
+ greet: async function (n) {
+ return "greetings from web " + n;
+ },
+ };
+ } else {
+ import("@tauri-apps/api/tauri").then((tauri) => {
+ ng = { greet: (n) => tauri.invoke("greet", { name: n }) };
+ });
+ }
- async function greet(){
+ async function greet() {
// Learn more about Tauri commands at https://tauri.app/v1/guides/features/command
- greetMsg = await invoke("greet", { name })
+ greetMsg = await ng.greet(name);
}
</script>
<div>
<div class="row">
<input id="greet-input" placeholder="Enter a name..." bind:value={name} />
- <button on:click={greet}>
- Greet
- </button>
+ <button on:click={greet}> Greet </button>
</div>
<p>{greetMsg}</p>
-</div>
\ No newline at end of file
+</div>
diff --git a/ng-app-native/src/routes/Home.svelte b/ng-app-native/src/routes/Home.svelte
index 62bc65e6..51d3200c 100644
--- a/ng-app-native/src/routes/Home.svelte
+++ b/ng-app-native/src/routes/Home.svelte
@@ -1,3 +1,8 @@
+<script>
+ import { Button } from "flowbite-svelte";
+ import { link } from "svelte-spa-router";
+</script>
+
<main class="container2">
<div class="row">
<img src="/nextgraph.svg" class="logo block h-40" alt="NextGraph Logo" />
@@ -5,27 +10,29 @@
<h1 class="text-2xl mb-10">Welcome to NextGraph</h1>
<div class="row">
- <button
- type="button"
- class="text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:outline-none focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55 mr-2 mb-2"
- >
- <svg
- class="w-8 h-8 mr-2 -ml-1"
- fill="none"
- stroke="currentColor"
- stroke-width="1.5"
- viewBox="0 0 24 24"
- xmlns="http://www.w3.org/2000/svg"
- aria-hidden="true"
+ <a href="/test" use:link>
+ <button
+ type="button"
+ class="text-white bg-primary-700 hover:bg-primary-700/90 focus:ring-4 focus:outline-none focus:ring-primary-700/50 font-medium rounded-lg text-lg px-5 py-2.5 text-center inline-flex items-center dark:focus:ring-primary-700/55 mr-2 mb-2"
>
- <path
- stroke-linecap="round"
- stroke-linejoin="round"
- d="M19 7.5v3m0 0v3m0-3h3m-3 0h-3m-2.25-4.125a3.375 3.375 0 11-6.75 0 3.375 3.375 0 016.75 0zM4 19.235v-.11a6.375 6.375 0 0112.75 0v.109A12.318 12.318 0 0110.374 21c-2.331 0-4.512-.645-6.374-1.766z"
- />
- </svg>
- Create account
- </button>
+ <svg
+ class="w-8 h-8 mr-2 -ml-1"
+ fill="none"
+ stroke="currentColor"
+ stroke-width="1.5"
+ viewBox="0 0 24 24"
+ xmlns="http://www.w3.org/2000/svg"
+ aria-hidden="true"
+ >
+ <path
+ stroke-linecap="round"
+ stroke-linejoin="round"
+ d="M19 7.5v3m0 0v3m0-3h3m-3 0h-3m-2.25-4.125a3.375 3.375 0 11-6.75 0 3.375 3.375 0 016.75 0zM4 19.235v-.11a6.375 6.375 0 0112.75 0v.109A12.318 12.318 0 0110.374 21c-2.331 0-4.512-.645-6.374-1.766z"
+ />
+ </svg>
+ Create account
+ </button>
+ </a>
</div>
<div class="row mt-10">
<button
diff --git a/ng-app-native/src/routes/Test.svelte b/ng-app-native/src/routes/Test.svelte
index a66e8f80..6363a345 100644
--- a/ng-app-native/src/routes/Test.svelte
+++ b/ng-app-native/src/routes/Test.svelte
@@ -2,7 +2,7 @@
import Greet from "../lib/Greet.svelte";
</script>
-<main class="container">
+<main class="container2">
<h1>Welcome to test</h1>
<div class="row">
diff --git a/ng-app-native/vite.config.ts b/ng-app-native/vite.config.ts
index d8437cda..b4cbd9cb 100644
--- a/ng-app-native/vite.config.ts
+++ b/ng-app-native/vite.config.ts
@@ -24,21 +24,22 @@ export default defineConfig(async () => {
clearScreen: false,
// tauri expects a fixed port, fail if that port is not available
server: {
- port: 1420,
+ port: process.env.NG_APP_WEB ? 1421 : 1420,
host: '0.0.0.0',
strictPort: true,
hmr: {
protocol: 'ws',
host,
- port: 5183,
+ port: process.env.NG_APP_WEB ? 5184 : 5183,
},
},
// to make use of `TAURI_DEBUG` and other env variables
// https://tauri.studio/v1/api/config#buildconfig.beforedevcommand
- envPrefix: ["VITE_", "TAURI_"],
+ envPrefix: ["VITE_", "TAURI_", "NG_"],
build: {
+ outDir: process.env.NG_APP_WEB ? 'dist-web' : 'dist',
// Tauri supports es2021
- target: process.env.TAURI_PLATFORM == "windows" ? "chrome105" : "safari13",
+ target: process.env.NG_APP_WEB ? 'modules' : process.env.TAURI_PLATFORM == "windows" ? "chrome105" : "safari13",
// don't minify for debug builds
minify: !process.env.TAURI_DEBUG ? "esbuild" : false,
// produce sourcemaps for debug builds