search

litegraph-tsx / litegraph.tsx

Modernization of litegraph and expansion of its capabilities
Other
6 stars 0 forks source link

The usage of `@/` and vite #13

Open liusida opened 3 months ago

liusida commented 3 months ago

Hi, guys. I am trying to integrate this into my new project. But I don't want to use Vite in my project.

The problem is that all files in src/nodes/ contains import statements like:

import { LiteGraph } from "@/litegraph.js";

And I don't know how to make it work without using Vite. Any hints?

liusida commented 3 months ago

maybe we also want to add the sourcemap to the built litegraph.mjs, so that we can see the source file in the browser.

image

daniel-lewis-ab commented 3 months ago

Yeah, the demo site on github doesn't like the @'s either, but the solution is probably to run the built files. We're also about to start using typescript more thoroughly and it doesn't run from source either.

On Wed., Jul. 17, 2024, 06:45 Liu Sida, @.***> wrote:

Hi, guys. I am trying to integrate this into my new project. But I don't want to use Vite in my project.

The problem is that all files in src/nodes/ contains import statements like:

import { LiteGraph } from "@/litegraph.js";

And I don't know how to make it work without using Vite. Any hints?

— Reply to this email directly, view it on GitHub https://github.com/litegraph-tsx/litegraph.tsx/issues/13, or unsubscribe https://github.com/notifications/unsubscribe-auth/AC36LN3233GSZI5M565CCELZMZROLAVCNFSM6AAAAABLAR46R6VHI2DSMVQWIX3LMV43ASLTON2WKOZSGQYTGNJTGIYTSNA . You are receiving this because you are subscribed to this thread.Message ID: @.***>

DrJKL commented 3 months ago

Exactly, the source files need to be compiled/bundled, then you'll have functional dist files.

DrJKL commented 3 months ago

We could also add an action to use Vite to deploy the example: https://vitejs.dev/guide/static-deploy#github-pages

atlasan commented 3 months ago

in index.html adding the importmap solved to me without need to make a dist

<script type="importmap">
        {
          "imports": {
            "@/litegraph.js": "./src/core/litegraph.js"
            ,"@/LGraphCanvas.js": "./src/core/LGraphCanvas.js"
            ,"@libs/litegl.js": "./src/libs/litegl.js"
            ,"@libs/gl-matrix-min.js": "./src/libs/gl-matrix-min.js"
            ,"@libs/audiosynth.js": "./src/libs/audiosynth.js"
            ,"@libs/audiosynth.js": "./src/libs/audiosynth.js"
            ,"@libs/sillyclient.js": "./src/libs/sillyclient.js"
            ,"@libs/midi-parser.js": "./src/libs/midi-parser.js"
          }
        }
    </script>