mimecorg / vuido Goto Github PK
View Code? Open in Web Editor NEWNative desktop applications using Vue.js.
Home Page: https://vuido.mimec.org/
License: MIT License
Native desktop applications using Vue.js.
Home Page: https://vuido.mimec.org/
License: MIT License
I've created a window like this:
let exampleWindow = null;
exampleWindow = new Vue({
render: h => h(ExampleWindow)
});
exampleWindow.$mount();
Use exampleWindow.$mount()
again will create a same new window, but I want to bring the existed window to front, but there seems no such API now?
Just an FYI in case caching prevented you from seeing it.
how can I use tags to output items, for example, to display a table?
Is there a Patreon, Ko-fi, or Paypal address we can give donations to in order to help keep Vuido development going?
Vuido, do you support the picture now?
Thanks for the great job. I just wanna ask about table in vuido. In libui there is a table component. Is there any update with vuido to use table, any documentation about table?
I really like the idea of html/js/etc to desktop app.
I really do NOT like the idea of a desktop app being dependent on listening to tcp/ip ports.
It looks like this one might not be...? is it? If so, then what's the alternative for getting input/data from the ui to the code[since ajax & not tcp/ip].
Are there any like that[besides vuido]?
Hi
I just saw your app and if you need a new logo or widget design i can help you
You can tell me what kind of a logo do you want
I am waiting for you reply
Disregard - close
I'm trying to run this, but if I hit the Cancel
button of the open file dialog I'm getting an error and my app close unexpectedly.
<template>
<Window ref="mainWindow">
<Button @click="selectFile">Browse...</Button>
</Window>
</template>
<script>
import libui from 'libui-node'
export default {
methods: {
selectFile () {
const window = this.$refs.mainWindow.window
const filename = libui.UiDialogs.openFile(window)
if (filename) {
console.log(filename)
}
}
}
}
</script>
The error is:
[...]/dist/main.js:120
const filename = __WEBPACK_IMPORTED_MODULE_0_libui_node___default.a.UiDialogs.openFile(window);
^
Error: basic_string::_M_construct null not valid
at VueComponent.selectFile ([...]/dist/main.js:120:91)
at invoker ([...]/dist/main.js:2589:18)
If you are using one data variable for conditional render by "v-if" for two elements, it crashes on change:
<template>
<Window title="vuido-project" width="400" height="100" margined v-on:close="exit">
<Box>
<Text>Press the button!</Text>
<Text v-if="!buttonIsOn">Thanks!</Text>
<Button v-on:click="buttonOn" v-if="buttonIsOn" >Ok</Button>
</Box>
</Window>
</template>
<script>
import libui from 'libui-node'
export default {
data: function () {
return {
buttonIsOn: true
}
},
methods: {
exit() {
libui.stopLoop();
},
buttonOn() {
console.log(this.buttonIsOn);
this.buttonIsOn = false;
}
}
}
</script>
[Vue warn]: Error in nextTick: "Error: Child node already has a parent"
(node:6216) UnhandledPromiseRejectionWarning: Error: Child node already has a parent...
But if you using different variables it works:
<template>
<Window title="vuido-project" width="400" height="100" margined v-on:close="exit">
<Box>
<Text>Press the button!</Text>
<Text v-if="buttonIsOn1">Thanks!</Text>
<Button v-on:click="buttonOn" v-if="buttonIsOn" >Ok</Button>
</Box>
</Window>
</template>
<script>
import libui from 'libui-node'
export default {
data: function () {
return {
buttonIsOn: true,
buttonIsOn1: true
}
},
methods: {
exit() {
libui.stopLoop();
},
buttonOn() {
console.log(this.buttonIsOn);
this.buttonIsOn = false;
this.buttonIsOn1 = false;
}
}
}
</script>
Hello, I am a Chinese user and I am open to VPN. I can access your github, but I can't access https://vuido.mimec.org/. I would like to ask if there are other API addresses? Or can I provide a gh-pages?
I can't spread the returning of vuex's mapState/mapMutations/...
This code:
<template>
<Window title="Vuido Example" width="400" height="100" margined v-on:close="$exit">
<Box padded>
<Text>
{{ name }}
</Text>
</Box>
</Window>
</template>
<script>
import { mapState, mapMutations } from 'vuex'
export default {
data: () => ({
}),
computed: {
...mapState([
'name'
])
}
}
</script>
Throws following error:
ERROR in ./src/MainWindow.vue?vue&type=script&lang=js& (./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./src/MainWindow.vue?vue&type=script&lang=js&)
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: Unexpected token (19:8)
17 | },
18 | computed: {
19 | ...mapState([
| ^
20 | 'name'
21 | ])
22 | }
Hi, great project
Please, can you help me with some issues- how I can add a system tray support to application?
Hello, is it possible to use vuido with vue-cli webpack template? I've run into a couple of issues.
I'm getting this error: Cannot find module 'vuido-template-compiler',
I can't find how to put a image in the document.
Not support?
This is an early project so I think changing the name isn't to late
vuido isn't sounding that great, I mean it looks ugly and is scratching my ears when somebody is saying it
I have some ideas for the new name:
If someone has other ideas let's vote them
Is there any way to create scrollView like component?
When I go to the documentation site there is some problem with the HTTPS cert or something and the browser flags it as a dangerous site, I can try to bypass it but my corprate VPN's DNS or something flags it and says it is "π»A Malwareπ»"
I think it would make more sense to host the documentation on GitHub pages. You would inherit the https automatically, and it would be located at:
To do this, make a new branch called gh-pages
and add a file called .no-jekyll
, and then you have a static hosted website for free where people can contribute to the documentation. You could even use VuePress for it if you want, or something else, I don't really care, just throwing out ideas.
Hi,
I've been trying to use vuido for a fun little project and have issues with those 2 components sizes.
You can see it here: https://github.com/benavern/coffee-break
As you can see on screenshots or if you try to run it (I tried on linux & windows) Textarea & Progressbar components are very little. I didn't see anything in the documentation that could help me with this. Are there some attributes or anything else that is not documented that is meant to change the default size?
Thanks in advance!
Benjamin
Is there a way to support drag and drop of files to the application?
Hi.
I tried create WAMP application with Electron. And I got strange mistake that Electron app can't create WAMP object, because Electron doesn't know about this process nothing.
What about Vuido? Can I use Vuido with web sockets and WAMP?
If I try TextInput
widget, an error will be thrown after running npm run start
, but build command before that is okay.
Error: Unknown element TextInput
at Object.createElement (.\dist\main.js:6484:30)
at createElm (.\dist\main.js:3600:79)
at createChildren (.\dist\main.js:3708:9)
at createElm (.\dist\main.js:3619:9)
at createChildren (.\dist\main.js:3708:9)
at createElm (.\dist\main.js:3619:9)
at VueComponent.patch [as __patch__] (.\dist\main.js:4064:7)
at VueComponent.Vue._update (.\dist\main.js:717:19)
at VueComponent.updateComponent (.\dist\main.js:822:10)
at Watcher.get (.\dist\main.js:2373:27)
Thanks for your attention.
I am a designer and I am good at designing logos, do you need a logo for your project "vuido". I will make it and it is for free I give to you.
This is a cool little project, and I know it is early in its development, but I wanted to make a recommendation. I sort of followed the instructions and was able to modify and build a vuido node app relatively painlessly - even including the fs
module to read out the CWD contents.
However, when I tried to run the main.js project from another folder, it complained that it couldn't find ../../dist/vuido.js
.
Now, I just cloned the project and worked in the "example folder", so there might be other issues when importing / requiring it, however I find the number of main.js files disconcerting - as are the number of dist folders. Might this moment in time be a good one to think about the packaging?
I have a basic application working, essentially a block of text (description) followed by a slider, followed by "ok" / "cancel". Can anyone tell me;
a. How do I centre a text block / how do I insert a centred line of text in a window?
b. How to I right justify the contents of a box, so for example how to I get ok/cancel in the bottom right of my window rather than bottom left?
Positioning control aside, this is looking very interesting / exciting .. ! :)
I've run across a number of issues with the and components, which may be libUI issues, but very well may be race conditions in vuido. When is placed inside , it renders inside a 1x1 box, making it appear it has not worked at all.
Now to further confuse things... in linux (GTK), adding scrollable="false" height="1"
appears to make it render at least well enough for my purposes... however, that hacky little fix does not seem to work for windows.
Code wise, i've pretty much copy pasted the examples... Is there a way we can force a layout update? I'm not sure thats where the issue is, but thats where my suspicions lie.
Hello, so I need to build a desktop work that needs to work without internet using Vuido, and I need a mechanism for storing data offline.
Hi, is it possible to use any vuejs library with vuido? I'm looking for options to write a pdf viewer (possibly an editor) and vuido would be a great tool to do this. Thanks
I would like to create a menu exm - File, Edit, View. Are there any option. Are there any page option where I can go one page to another
As the title suggests, is this possible currrently with Libui? I guess a simple step property would suffice.
Hi, libui-node author here.
I'm writing just to say hi and compliment for this awesome project.
Feel free to /CC me if you get problem related to the native part of the project, I'll try to help as I can...
ππ»
Hi,
I am evaluating which tool to use to wrap our existing vue-based web application for Windows MacOS and Linux. I came upon vuido and now I am intrigued to use it, because we already use vue for the frontend in our web application project. But I can't find any documentation or example how to use vuido with an existing vue project...
Can you provide some links / info / examples about this?
Thanks in advance,
Anne
First of all, I think this could be a very good Electron alternative. Especially regarding the distribution packet size. Do you have an idea how it would relate to Electron (percentage wise)?
My question; are there plans for vue cli 3 support? I have completely switched to cli3 now and I think everyone should... :)
I'm trying to use UiDialogs.openFile
but it requires a parameter UiWindow *parent
.
How do I get a reference for my Window
?
Example I'm trying to run:
const filename = libui.UiDialogs.openFile(win);
Hi :)
I tryed to use task "watch" in package.json but it only build the app on each changes, I still had to start app on another terminal to see any updates. It's annoying to kill/start app after each changes so I add this "dev" task :
"dev": "nodemon --exec run-s build:dev start:dev",
with this nodemon
config :
"nodemonConfig": {
"ext": "js,vue",
"ignore": [
"build/*",
"dist/*",
"node_modules/*"
],
"watch": [
"src/*"
]
}
and these packages as dev dependencies : nodemon
& npm-run-all
Now on each changes in js
or vue
files in src
folder, nodemon will kill vuido app, build and start the freshly updated app again.
Am I using the default stack wrong or this feature is not available yet ?
How I may to set fixed width and height of Box or Tab?
It is possible?
I tried to spin up a simple vuido app on my livestream today and ran into some issues.
Looks like the latest version of vuido with textinput and textarea is not published to npm?
https://youtu.be/aRj8jNzuphk?t=4667
I ended up re-building the runtime from source and got it working.
Also, got the error [Vue warn]: Failed to resolve directive: model
when trying to use v-model.
The project is here: https://github.com/CodingGarden/morning-tea/tree/master/05-24-2018/vuido-demo
I used the vuido template.
Hello contributors,
I have some questions here.
Here is my code:
setInterval(() => {
console.log('Tick tock')
}, 1000)
I think it will write on the console every second: tick tock
but no, it will only print when i move the mouse in front of the window :(
Is it right?
However, at some point, I will write:
setTimeout(() => {
// do sth
}, ms)
and it was never triggered until I moved the mouse? @@
Please give me an answer. Thank you.
What about having a dedicated CLI instead of using it with vue-cli?
Hi, I'm looking for info about creating desktop apps (windows exe/osx app)
Is this not working yet?
Cool project. We've been looking into doing something similar for the Aurelia framework. I'm wondering, how much of this work is Vue-specific, vs. how much is re-usable in a way that could benefit other frameworks with a templating language? I think this could be an interesting project to work together on, in a cross-framework way. I'd love to hear your thoughts.
always coming with myriads of errors.
intended?
I have a tab with a TextArea
in it, and when I click on the textarea, the window crashes.
Console output:
/bin/sh: line 1: 20865 Segmentation fault: 11 node ./dist/main.min.jserror Command failed with exit code 139.
Hi,
I'm wondering if it is possible to build some kind of menu system in Vuido?
Let's say that you would like a drawer and drop-down menus in the header.
Regards
HΓ₯kan
When running npm install on mimecorg/vuido-webpack-template initialized project I am getting error
CXX(target) Release/obj.target/nbind/src/arch/darwin/libui_loop.o
In file included from ../src/arch/darwin/libui_loop.mm:1:
In file included from /Users/colinbes/tmp/mynative/node_modules/libui-node/src/includes/event-loop-darwin.h:4:
In file included from /System/Library/Frameworks/Cocoa.framework/Headers/Cocoa.h:12:
In file included from /System/Library/Frameworks/Foundation.framework/Headers/Foundation.h:6:
In file included from /System/Library/Frameworks/CoreFoundation.framework/Headers/CoreFoundation.h:43:
In file included from /System/Library/Frameworks/CoreFoundation.framework/Headers/CFBase.h:72:
/usr/local/include/Block.h:16:3: error: Never include this file directly. Use <lzma.h> instead.
# error Never include this file directly. Use <lzma.h> instead.
^
npm version 6.8.0
node version 10.10.0 (have also tried 8.x.x)
vue version 3.4.1 (same error trying vue 2.9.6)
macOS version Mojave 10.14.3
xcode installed - yes
When binding a value to the 'type' attribute of a TextInput, and causing an update to change the type, vuido throws an Error
[Vue warn]: Error in nextTick: "Error: TextInput does not have attribute type"
(node:22840) UnhandledPromiseRejectionWarning: Error: TextInput does not have attribute type
example:
<template>
<Box>
<TextInput :type="activeType" />
<Button v-on:click="toggleActiveType" >Change Type</Button>
</Box>
</template>
<script>
export default {
data() {
return { activeType: "password" };
},
methods: {
toggleActiveType () {
this.activeType = this.activeType === "password" ? "text" : "password";
}
}
};
</script>
A declarative, efficient, and flexible JavaScript library for building user interfaces.
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. πππ
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google β€οΈ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.