CDN version to use in the <script> tag

[Mashiane]

Hi there

Is it possible to have a dist for this that one can use in the <script> tag?

Thank you so much!

[bcakmakoglu]

Currently, no.
It might be something I add in the future though, so I will keep this thread open as an interest check. 😄

[agtabesh]

Nothing related!

[bcakmakoglu]

Mh... No idea why the App doesn't actually mount the component properly.
This works:

<div id="app" style="height: 100vh"></div>

<script>
  const { ref, createApp, h } = Vue
  const { VueFlow } = vueFlowCore

  const app = createApp({
    setup() {
      const elements = ref([
        { id: '1', type: 'input', label: 'Node 1', position: { x: 250, y: 5 } },
        { id: '2', label: 'Node 2', position: { x: 100, y: 100 } },
        { id: '3', label: 'Node 3', position: { x: 400, y: 100 } },
        { id: '4', type: 'output', label: 'Node 4', position: { x: 400, y: 200 } },
        { id: 'e1-3', source: '1', target: '3' },
        { id: 'e1-2', source: '1', target: '2', animated: true },
      ])

      return () => h(VueFlow, { modelValue: elements.value })
    },
  })

  process = {
    env: {
      NODE_ENV: 'development',
    },
  }

  app.mount('#app')
</script>

Though there seems to be an issue with the library looking for process.env which doesn't work from this package (hence I set that global myself, which is not good practice obviously).

[agtabesh]

Yes! I think the problem comes from there.
By the way, thanks a lot.

[bcakmakoglu]

Though other components like Background, Minimap don't seem to work, I'll take a look at that and try to fix the process.env issue as well :)

[agtabesh]

Very well though, I'll be happy if there is anything I can help with.
Thanks again.

[Mashiane]

Awesome, thank you so much, will check it out. Your work is amazing, congratulations.