feat(IDE): Ide v0.0.1 release, upgrade to node.js 20 (#214)

* fix: add pnpm install to IDE publish script (#213) * fix: specific version of pnpm install Getting this error on pnpm install with node 20... pnpm/pnpm#6424 * chore: update pnpm, update to node 20, remove ide narrat deps * chore: trying to get the tauri action CI to find the right config * chore: still trying to fix CI * chore: ... * chore: ...
liana-p · Jan 23, 2024 · 09841f3 · 09841f3
1 parent 9529b26
commit 09841f3
Show file tree

Hide file tree

Showing 30 changed files with 1,749 additions and 3,710 deletions.
diff --git a/.github/workflows/ide.yml b/.github/workflows/ide.yml
@@ -1,4 +1,4 @@
-name: 'publish'
+name: 'ide-release'
 
 # This will trigger the action on each push to the `release` branch.
 on:
@@ -33,7 +33,13 @@ jobs:
           sudo apt-get update
           sudo apt-get install -y libgtk-3-dev libwebkit2gtk-4.0-dev libappindicator3-dev librsvg2-dev patchelf
 
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v2.4.0
+        with:
+          version: latest
+
       - name: install frontend dependencies
+        working-directory: packages/desktop-editor
         run: pnpm install # change this to npm or pnpm depending on which one you use
 
       - uses: tauri-apps/tauri-action@v0
@@ -46,4 +52,5 @@ jobs:
           releaseDraft: true
           prerelease: false
           projectPath: 'packages/desktop-editor'
-          tauriScript: 'pnpm'
+          tauriScript: 'pnpm tauri'
+          args: --config src-tauri/tauri.conf.json
diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml
@@ -10,8 +10,6 @@ on:
       - main
       - v2.0.0
       - release/*
-      - feat/*
-      - fix/*
 
   pull_request:
 
@@ -32,10 +30,12 @@ jobs:
       - name: Use Node.js
         uses: actions/setup-node@v2
         with:
-          node-version: '18.x'
+          node-version: '20.x'
 
       - name: Install pnpm
-        uses: pnpm/action-setup@v2.2.2
+        uses: pnpm/action-setup@v2.4.0
+        with:
+          version: latest
 
       - name: Install deps
         run: pnpm install

diff --git a/demo-template/.nvmrc b/demo-template/.nvmrc
@@ -1 +1 @@
-v18.14.2
+v20
diff --git a/demo-template/package.json b/demo-template/package.json
@@ -4,7 +4,7 @@
   "description": "Template for Narrat game engine",
   "main": "electron-main.js",
   "engines": {
-    "node": ">=18.x"
+    "node": ">=20.x"
   },
   "build": {
     "files": [
@@ -16,7 +16,7 @@
     "vue.js",
     "snowpack"
   ],
-  "author": "Liana Pigeot <liana.pigeot@protonmail.com>",
+  "author": "Liana Pigeot <32243840+liana-p@users.noreply.github.com>",
   "license": "MIT",
   "scripts": {
     "start": "npm run dev",

diff --git a/docs/guides/getting-started.md b/docs/guides/getting-started.md
@@ -28,7 +28,7 @@ If you prefer to follow a video, this one minute video shows the entire setup fr
 ## Prerequisites
 
 - Be on a computer running Windows, MacOS or Linux
-- Have [node.js ](https://nodejs.org/en/) 16+ installed (pick the current LTS version on the website)
+- Have [node.js ](https://nodejs.org/en/) 20+ installed (pick the current LTS version on the website).
 - A text editor, we recommend [VS Code](https://code.visualstudio.com/Download).
 
 ## Creating the game project

diff --git a/ide.code-workspace b/ide.code-workspace
@@ -2,12 +2,12 @@
   "folders": [
     {
       "name": "root",
-      "path": "."
+      "path": ".",
     },
     {
       "name": "IDE",
-      "path": "packages/desktop-editor"
-    }
+      "path": "packages/desktop-editor",
+    },
   ],
   "settings": {
     "vitest.enable": true,
@@ -23,21 +23,21 @@
       "**/*.rpa": true,
       "**/*.rpymc": true,
       "**/cache/": true,
-      "**/lib.ts": true
+      "**/lib.ts": true,
     },
     "search.exclude": {
       "dist/": true,
       "lib/": true,
       "node_modules/": true,
-      "**/lib.ts": true
+      "**/lib.ts": true,
     },
     "editor.formatOnSave": true,
     "editor.defaultFormatter": "esbenp.prettier-vscode",
     "[javascript]": {
-      "editor.defaultFormatter": "esbenp.prettier-vscode"
+      "editor.defaultFormatter": "esbenp.prettier-vscode",
     },
     "[typescript]": {
-      "editor.defaultFormatter": "esbenp.prettier-vscode"
+      "editor.defaultFormatter": "esbenp.prettier-vscode",
     },
     "typescript.preferences.autoImportFileExcludePatterns": [
       "@/lib/**",
@@ -46,7 +46,7 @@
       "src/lib",
       "**/node_modules/**",
       "**/dist/**",
-      "**/lib/**"
-    ]
-  }
+      "**/lib/**",
+    ],
+  },
 }
diff --git a/package.json b/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "type": "module",
   "engines": {
-    "node": ">=16"
+    "node": ">=20"
   },
   "description": "Narrat monorepo",
   "main": "index.js",
@@ -34,7 +34,7 @@
     "url": "https://github.com/liana-p/narrat-engine/issues"
   },
   "homepage": "https://narrat.dev",
-  "packageManager": "pnpm@7.5.2",
+  "packageManager": "pnpm@8.14.3",
   "pnpm": {
     "overrides": {
       "narrat": "workspace:*",

diff --git a/packages/create-narrat-plugin/package.json b/packages/create-narrat-plugin/package.json
@@ -18,7 +18,7 @@
     "template/*"
   ],
   "engines": {
-    "node": ">= 18.x"
+    "node": ">=20"
   },
   "repository": {
     "type": "git",

diff --git a/packages/create-narrat/package.json b/packages/create-narrat/package.json
@@ -14,7 +14,7 @@
     "template-games/*"
   ],
   "engines": {
-    "node": ">= 18.0.0"
+    "node": ">=20"
   },
   "repository": {
     "type": "git",

diff --git a/packages/create-narrat/template/.nvmrc b/packages/create-narrat/template/.nvmrc
@@ -1 +1 @@
-v18
+v20
diff --git a/packages/create-narrat/template/package.json b/packages/create-narrat/template/package.json
@@ -5,14 +5,14 @@
   "description": "Template for Narrat game engine",
   "main": "electron-main.js",
   "engines": {
-    "node": ">=18.x"
+    "node": ">=20"
   },
   "keywords": [
     "game",
     "vue.js",
     "snowpack"
   ],
-  "author": "Liana Pigeot <liana.pigeot@protonmail.com>",
+  "author": "Liana Pigeot <32243840+liana-p@users.noreply.github.com>",
   "license": "MIT",
   "scripts": {
     "start": "npm run dev",

diff --git a/packages/desktop-editor/.nvmrc b/packages/desktop-editor/.nvmrc
@@ -1 +1 @@
-v18
+v20
diff --git a/packages/desktop-editor/README.md b/packages/desktop-editor/README.md
@@ -1,23 +1,31 @@
 # Narrat Desktop Editor
 
-WIP
+A game editor IDE for narrat games, built with [tauri](https://tauri.app/).
 
-Structure:
+**This editor is in early development. It works for very basic use but is not yet the recommended way to edit narrat games.**
 
-- vite project running the editor UI
-- tauri app to run the editor in a desktop app
-- monacco editor for text editing
+## Installing
 
-## Installation
+Once the CI build is working, there will be GitHub releases with binaries to download for Windows/MacOS/Linux. For now, the only way to run this is from the source.
 
-- Have [node.js](https://nodejs.org) installed
-- Have rust installed: `curl --proto '=https' --tlsv1.2 https://sh.rustup.rs -sSf | sh`
-- Run `npm install`
+## Running from source
 
-## Running
+### Installation
 
-Run `npm run dev` to start the IDE. Then use the menu to open a folder containing a narrat project.
+- Clone or download this repo
+- Install [node.js](https://nodejs.org) 20+ (LTS recommended)
+- Install [pnpm](https://pnpm.io/installation). Narrat is a monorepo which uses pnpm instead of npm.
+- Install Rust: `curl --proto '=https' --tlsv1.2 https://sh.rustup.rs -sSf | sh`
+- Run `pnpm install`
 
-## Building
+### Running
 
-Not implemented yet
+Run `pnpm dev` to start the IDE. Then use the menu to open a folder containing a narrat project.
+
+### Building
+
+Run `pnpm build`
+
+### Releasing
+
+Releases are automatically triggered by the github workflow `ide.yml` when a push is made to a `ide-v*` branch. The workflow will build the app and upload the binaries to the release.
diff --git a/packages/desktop-editor/package.json b/packages/desktop-editor/package.json
@@ -5,14 +5,16 @@
   "description": "Desktop editor for narrat",
   "main": "electron-main.js",
   "engines": {
-    "node": ">=18.x"
+    "node": ">=20.x"
   },
   "keywords": [
     "game",
     "vue.js",
-    "snowpack"
+    "rust",
+    "tauri",
+    "narrat"
   ],
-  "author": "Liana Pigeot <liana.pigeot@protonmail.com>",
+  "author": "Liana Pigeot <32243840+liana-p@users.noreply.github.com>",
   "license": "MIT",
   "scripts": {
     "dev": "pnpm tauri dev",
@@ -27,67 +29,27 @@
   "dependencies": {
     "@tauri-apps/api": "^1.5.3",
     "clone-deep": "^4.0.1",
-    "electron-squirrel-startup": "^1.0.0",
     "es6-promise": "^4.2.8",
     "monaco-editor": "0.44.0",
     "monaco-yaml": "^5.1.0",
-    "narrat": "workspace:*",
     "oh-vue-icons": "1.0.0-rc3",
     "pinia": "^2.1.7",
     "steamworks.js": "^0.2.0",
     "vue": "^3.4.15",
     "vue-router": "4"
   },
   "devDependencies": {
-    "@electron-forge/cli": "^6.1.1",
-    "@electron-forge/maker-deb": "^6.1.1",
-    "@electron-forge/maker-rpm": "^6.1.1",
-    "@electron-forge/maker-squirrel": "^6.1.1",
-    "@electron-forge/maker-zip": "^6.1.1",
-    "@electron/rebuild": "^3.2.13",
     "@tauri-apps/cli": "^1.5.9",
     "@types/clone-deep": "^4.0.1",
     "@vitejs/plugin-vue": "^4.2.3",
     "@vue/devtools": "^7.0.11",
     "cross-env": "^7.0.3",
-    "electron": "^25.8.4",
-    "electron-winstaller": "^5.1.0",
     "prettier": "^3.0.0",
     "shx": "^0.3.4",
     "typescript": "^5.1.6",
     "vite": "^5.0.12",
     "vite-plugin-monaco-editor": "^1.1.0",
-    "vite-plugin-narrat": "3.6.0",
     "vite-plugin-windicss": "^1.9.0",
     "windicss": "^3.5.6"
-  },
-  "config": {
-    "forge": {
-      "packagerConfig": {},
-      "makers": [
-        {
-          "name": "@electron-forge/maker-squirrel",
-          "config": {
-            "name": "Your game name",
-            "authors": "Your name",
-            "description": "Your game description"
-          }
-        },
-        {
-          "name": "@electron-forge/maker-zip",
-          "platforms": [
-            "darwin"
-          ]
-        },
-        {
-          "name": "@electron-forge/maker-deb",
-          "config": {}
-        },
-        {
-          "name": "@electron-forge/maker-rpm",
-          "config": {}
-        }
-      ]
-    }
   }
 }
diff --git a/packages/desktop-editor/src/components/editor/EditorPanel.vue b/packages/desktop-editor/src/components/editor/EditorPanel.vue
@@ -26,7 +26,7 @@ import {
   computed,
 } from "vue";
 import * as monaco from "monaco-editor/esm/vs/editor/editor.api";
-import { debounce } from "narrat";
+import { debounce } from "@/utils/debounce";
 import { useIDE } from "@/stores/ide-store";
 import { OpenedFile } from "@/filesystem/file-types";
 

diff --git a/packages/desktop-editor/src/pages/IDEPage.vue b/packages/desktop-editor/src/pages/IDEPage.vue
@@ -1,7 +1,5 @@
 <script setup lang="ts">
 import { computed, ref } from "vue";
-import MonacoEditor from "@/components/MonacoEditor.vue";
-// import NarratPreview from "@/components/NarratPreview.vue";
 import ExplorerPanel from "@/components/explorer/ExplorerPanel.vue";
 import PreviewGame from "@/components/preview/PreviewGame.vue";
 import EditorPanel from "@/components/editor/EditorPanel.vue";
@@ -29,37 +27,10 @@ const editorStyle = computed(() => {
 </script>
 <template>
   <div class="w-full bg-neutral-900">
-    <!-- <div class="container mx-auto p-5">
-      <h1 class="title text-center">Narrat Demo Editor!</h1>
-      <ul>
-        <li>
-          🎮 Press <b>New Game</b> to play interactive demo that shows you how
-          the engine works.
-        </li>
-        <li>
-          ✏️ <b>Try changing the dialogue</b> script on the left to edit the
-          game yourself as you play!
-        </li>
-        <li>
-          ✅ When you're done, head to the
-          <a href="https://docs.narrat.dev" target="_blank" rel="noopener"
-            >documentation website</a
-          >
-          to learn how to continue with making your own game!
-        </li>
-      </ul>
-    </div> -->
     <div class="gap-4 w-full editor-layout flex justify-between h-screen">
       <ExplorerPanel class="flex-shrink-[5]" />
       <EditorPanel :style="editorStyle" />
-      <!-- <MonacoEditor class="h-screen transition-all" :style="editorStyle" /> -->
       <PreviewGame :style="narratStyle" />
-      <!-- <NarratPreview
-        class="game-preview h-screen z-30 transition-all"
-        :style="narratStyle"
-        @bigger="grow"
-        @smaller="shrink"
-      /> -->
     </div>
   </div>
 </template>

diff --git a/packages/desktop-editor/src/shims-narrat.d.ts b/packages/desktop-editor/src/shims-narrat.d.ts