I have an example project running on nodejs server (https://github.com/bbc/talexample), how to compile it into index.html, css and js to test in WebOS simulator?
As far I remember TAL framework serves the content on the fly depends of the client UA. You can check some of the TAL core modules like tal-page-strategies and config/devices.
Based on these configs the framework sets the Doctype, meta and other parts of the HTML files in order to build the correct app (HTML5, CE-HTML...for Smart TV , HbbTV, videoconsoles...)
You can try to extract the js, CSS, create the html..., but you will need to merge lot of code
Related
I'm thinking about developing an Excel add-in as described here.
Would that be possible with Svelte - and do you know of any guides/help if yes?
I have looked through the video here, and I'm about worried about the usage of webpack.
Well... let's break it down
Is it possible?
Short answer: yes
Long answer: the documentation clearly states that Excel add-in still uses jQuery for logic manipulations. If your question was about Angular or react it would probably be a hard NO since those frameworks use an engine that should be included as part of solution. This kind of dependencies when dealing with plugins development are pretty hard to implement and maintain as a function of time so it's better to use very lightweight, non-core dependencies instead. Since you are asking about svelte - it is "compiled" into a bundle that contains pure code (based on your app logic). So - as long as your app rely on the load event sequence described in the docs - you are good to go.
Do you really need Webpack?
Short answer: no
Long answer: svelte can be deployed using rollup instead - which is more suitable for micro-applications (such as yours). So, if you feel that webpack (somehow) is blocking your work pipeline - just use svelete default configuration with rollup and you are ready to go
Your workflow
Create a very simple svelte app (my suggestion - try to take the example in the docs and implement it using svelte)
Test it locally (just verify it works)
Build it (you should ended up with 3 files - 1 html file in public directory and 2 other files in public/build directory - 1 js file and 1 css file (both called bundle)
Here's the tricky part - the html file does nothing - just loading the css and js files. In your case - you don't really need it
Change the bundle.css file to Home.css file
Change the bundle.js file to Home.js file and put your app inside the add-in main function
'use strict';
(function () {
Office.onReady(function() {
// Office is ready
YOUR SVELTE APP CODE SHOULD BE PLACED HERE
});
})();
Pack your add-in and test it
Technical notes
If Excel blocks the creation of new elements (using dynamic injection) - this approach will NOT work (since your entire app is generated by your js file)
Please refer to this article for more information about packing your app
Try to make your app as lightweight and small-size as possible just to avoid the risk of exceeding the limits allowed for add-ins
I want to use the Ionic UI framework with Trigger.io for my hybrid mobile app, but it isn't clear to me just how to combine the two in my code because it's not like using Jquery where you just add the library to a script tag.
After install, both of these frameworks provide their own "hello world" type of index.html file, their own css and js files as well as framework specific configuration files which I know are important. So which one do I use as a base and how do I call into the other framework from that base? How do I structure the project file tree to combine the two so that when I go to do an app build for distribution, there isn't some crazy error because the frameworks are set up to look for their own files via set paths?
Here is one answer I found in my googling.
What steps do I need to take to use the Ionic Framework with trigger.io?
here is an example project on git hub:
https://github.com/travisrussi/ionic-triggerio
here is the link to the ionic cdn to be used for testing:
https://code.ionicframework.com/#
I'm trying to merge large existing web app into sails.js. so I moved the folders into assets and build a custom route , 'GET /': '/assets/client/launch.html' and get 404 when I point my browser to http://localhost:1337/ as the / is correctly redirected to http://localhost:1337/assets/client/launch.html which produces the 404.
Now the file exists in the folder assets/client (and in .tmp), so I am thinking the Sails router is getting in the way.
I would leave the client (70K lines of JS) that generates all the UI dynamically and sailjs server that provides authentication separate and enable CORS but my customer wants client packaged with server. This type of operation is simple in frameworks like ASP.NET MVC but am wondering if Sails is up to the task.
Well, If everything you tried did not work out. There might be another solution ,
First of all since you are talking about sails app I am assuming other bundle must be sails as well ,
So here is what you do-
Change the port for another app that you want to attach to this.
Second whenever you want to go to page on another app simply redirect the client to another port ie
in html or esp put a href tag with different port.
<a href="localhost:PORT/route_to_file">
</a>
I got it working by placing my app into assets where we need to launch from assets/client/index.html as there would be too many dependencies to change. As I said above could not just add a route as Sails must getting in the way. However as in Chapter 3.2.2 of Sails in Action I generated a static asset npm install sails-generate-static --save. then I redirected to assets/client/index.html. As an aside that book is great and would highly recommend it.
I'm not an experienced Javascript application developer, however, I've recently been learning some MEAN using http://mean.io/#!/ as my scaffolding.
I can see that the out of the box assets are listed in:
/server/config/assets.json
and when the app is running the referenced assets get combined into client side files:
/modules/aggregated.css
/modules/aggregated.js
When I create a package using MEAN.IO's CLI:
mean package myPackage;
and start including css or scripts in this package, presumably it is bad practice to then put the packages assets into the application's assets.json as these packages are supposed to be reusable modules that could be added to someone else's MEAN application.
What's the right place to reference the new package's assets so that they are added into the aggregration process?
you want to add css or js files into your packages.
If so, it's easy. As the doc says in "Assets and Aggregation" http://learn.mean.io/#mean-packages-assets-and-aggregation
you should use
//Adding another library - global by default is false
MyPackage.aggregateAsset('js','jquery.min.js', {global:true});
//Adding some css to the mean project
MyPackage.aggregateAsset('css','default.css');
So, this is a pretty trivial thing to accomplish apparently, but for some reason it just will not work for me. I created a VERY SIMPLE GWT app. It uses UIBinder just to display a label and a button, no actual processing or handling takes place. I did this to test deploying the app using strictly JS and html that is not hosted by Eclipse and Jetty or whatever.
I compile my app, run it in eclipse, and it works fine. However, when I try to run the html page directly from the WAR directory, it does not work.
Do I need this running on a webserver for it to work? It is just html and js, so I shouldn't? I've been to the GWT site about deploying, and surfed quite a few forums. They seem to always mention the necessity of a server, but it seems like it should not be necessary?
Since it is a pure JavaScript and HTML it should work properly without server. Checkout this link: Compile and run in Production Mode with Eclipse
In your EntryPoint class, in onModuleLoad() there's a RootPanel.get("someDivId") call somewhere. Make sure your html page (=the host page) contains a div with that id.
Also make sure your host page calls the right java script file. It's easy to forget to edit the host page after you renamed your GWT module (see rename-to in your .gwt.xml), as the generated JavaScript file matches your module name.
This will work locally on all browsers except Chrome for security reasons.
See http://code.google.com/p/chromium/issues/detail?id=31068
and http://code.google.com/p/chromium/issues/detail?id=70088