Web app to a packaged app with Dart - dart

I've been struggling with this for a few hours now. I've looked around and I believe I'm doing everything correctly, but it's just not working. Just for fun, I'm taking the sample Dart stopwatch and making it into a Chrome packaged app. It works flawlessly in both Dartium Chrome(via dart2js) when it's a simple web app, however as a packaged app it works in neither. The dart code simply doesn't work. Are there additional steps I need to perform to make Dart work in a web app?
Thank you very much for any help you can provide!

There are a few caveats when writing a packaged app in Dart. One is related to symlinks (packaged apps don't like them, and pub uses them), and the other is related to dart2js (you need to compile with the --disallow-unsafe-eval flag).
If you're using the Editor, you can create a new chrome packaged app from the wizard. This will set up a project that handles both issues above. I'd do that and make sure it runs, and then copy your web app into that project.

Related

Where does Chromium load extensions?

I'm trying to get a number of Chrome extensions working in an Electron app. Electron only supports dev tools extensions, so I'm writing code to handle regular extensions more-or-less from scratch. But, I'm getting stuck figuring out what's involved in getting the content scripts to run in the same way they do in Chrome.
In the existing Electron implementation, which is expressly limited to development tool extensions, I traced the code to here, specifically, line 392:
win.devToolsWebContents.executeJavaScript(Extensions.extensionServer._addExtension(${JSON.stringify(extensionInfo)}))
Finding the next step in this process has proved very challenging. I think, but am not certain, that HERE is the corresponding Chromium code, but this seems like it's for development tools extensions in particular (what with the calls to InspectorFrontendHost and the use of iframes).
Could anyone point me in the right direction? Where is the code where Chromium loads the content scripts for regular extensions? Or is this that code?

How to build a electron app from an built HTML(dist)?

I have been searching the internet but I couldn't find an answer. I just want to find out if I could use the built HTML.
To make things clear. I created a vue-CLI project. I created a built HTML by running an npm run build.
Running the npm run build will create a dist folder with an index HTML, and its needed resources.
Now I would like to add this in electron. Is this possible?
If your project is client-side html only, then it is ready to go: just use one of the minimal Electron examples, and set your index.html as the start page.
If it is connecting to a back-end server (e.g. to access a database), it can still do that, but it means the application won't be able to run offline.
It is worth considering why you want an Electron app, instead of just having a web app. E.g. Are you hitting any security restrictions or other limitations of a web app, that a desktop app does not have? If not, packaging as an Electron app might just be effort spent on something that no-one wants or needs.
As you've built with vue-cli, it might be worth looking at Quasar Framework which is a wrapper for Vue that comes with Electron and Mobile targets ready to go. You don't actually have to use any of their UI components to get this.

Is any possibilities to use ANT UI Design in Electron Desktop App Framework?

I have found so many facility to use javascript, Angular, material design ui with Electron App Framework, I would like to know, is there any possibilities to use ANT UI for my desktop application? At-least some work around.
Yes
The short answer is yes. Electron provides an entire NodeJS environment and allows you to use common Node, Javascript and React toolsets.
In fact, Electron is listed as an officially supported environment on their Github page.
That being said, it's a very diverse library so there might be occurrences where a particular component is not supported or might need tweaking to be compatible with the Electron environment.
Update
The company I work for actually had to do this for a project we're working on so I can officially confirm that it works great.

Dart in a stand-alone app that does NOT require Chrome to be installed

electron, node-webkit, brackets-shell and atom-shell are frameworks that allow a user to create stand alone executables that use HTML, CSS, and JavaScript (Node) for all code in the app. They don't require any prior installation of any software, as I understand it. I want to use Dart instead of JavaScript. I don't want a chrome app because that requires the installation of Chrome, if I understand correctly. Is it possible to make a stand-alone application using Dart? Will DartToJs be able to do this for me?
You need to have a Dart-VM (Dart-Runtime) installed in order to be able to execute Dart applications on the command line/server.
As far as I know there is no way to create a standalone executable, at least no easy one.
It is technically possible to create an executable that contains the Dart-VM but there are no tools available yet that generate that for you.
I don't think the path using Dart2JS will help much. Dart2JS aims primarily at browsers but I have heard that some try to use Dart2JS to run Dart code with Node.js but I don't know if that really works.
This similar question contains some links that may be of interest to you: Embedding Dart into application
dart2js + node-webkit will definitely do this for you. Just compile your webapp to js, make a proper package.json file and follow the standard directions on the node-webkit github page.
There's even a pub package that let's you use the node-webkit API from dart (filesystem access, window controls, and whatnot).
Search pub for node_webkit and you'll find it.
Good luck.

Run firefox extensions in xulrunner

I am just wondering if is it possible to run extension like colorzilla / firebug in xulrunner.
In fact I am creating my own extension now and I was trying addon_sdk but this is very problematic to put extension icon/button next to location bar.
So I decided to work with xul, and I know that problem doesn't exist here. And Of course the best way to learn is analyze other code, a changing it. But I can't run any extension in xulrunner. Any hint / help ?
xulrunner is just a runtime or platform. You'd need an actual app on top of that. In that regard, Firefox, Thunderbird, Seamonkey, InstantBird, etc. can be considered (complex) xulrunner apps.
Existing extensions may run, with or without modifications in such a xulrunner app. Well, likely with modifications, as most extensions use APIs specific to Firefox or Thunderbird or ...
The add-on SDK is not generally isn't a good fit for generic xulrunner apps: It is too much tailered against Firefox specifically.

Resources