I has been experimenting with Aurelia build options vis-a-vis development/build workflow. We have concluded that we prefer that developers test the web site while it is bundled, versus serving up all the individual files to the browser. Additionally, we are using TypeScript. And we want have the browser-side debugging experience provided by source maps. I am working with what will be a large application with many Aurelia components, so the few seconds for the page to refresh during the active development change/refresh or watch cycle seems like it will add up. And it seems that if developers are working in the bundles that bundling issues will be discovered immediately.
Using the Aurelia-cli (v23), and creating a new project using TypeScript, then building creates RequireJS bundles and source maps work for browser debugging. That is, after running au run.
Using the skeleton-typescript-webpack starter project (downloaded two weeks ago), then running npm start also provides browser side debugging of typescript of webpacked bundles.
Using skeleton-typescript which uses jspm and systemjs, running gulp serve-bundle does not provide client side typescript debugging. However, gulp serve does provides client side debugging, but the site is not bundled. The only difference between those gulp tasks is that the site is bundled, versus unbundled.
So it seems that typescript source map client side debugging of bundled sites will work with Aurelia-cli and webpack, but not with jspm.
Our project was started based on the skeleton-typescript. Before we refactor the build workflow, I have attempted to figure out how to get jspm to support typescript debugging on the browser.
I've hunted the web, but did not find any clear direction, and did much experimentation with configuration settings with a trial and error approach, but cannot seem to get a bundled jspm site to allow the client side typescript debugging experience.
Is this a limitation of jspm or systemJS or the Aurelia-Bundler? Or is there some configuration setting, in config.js or bundles.js, I need to add to the skeleton-typescript starter project to get this to work?
Maybe your are not getting access to source maps. I'm not sure, I remenber something about the way how source map are generated, (inline, file in a specific folder) and add mapping path in the server to make them acessible.
https://github.com/aurelia/skeleton-navigation/blob/master/skeleton-typescript-aspnetcore/src/skeleton/Startup.cs#L69-L74
Related
TL;DR;
Where can I find a bundled SAPUI5 runtime/SDK for local development?
Long story: The project generated by easy-ui5 loads the UI5 framework from the relative URL (resources/...) which with "modern" UI5 tooling, will be dynamically generated. However, the DX is not ideal. It's pretty sluggish.
The following screenshots were taken from the exact hello-world app generated by easy-ui5's ts-app config.
With CDN https://ui5.sap.com:
With Downloaded resource folder from https://tools.hana.ondemand.com/#sapui5:
Dynamically Generated by UI5 Tooling - Browser Cache Enabled
All the above screenshots capture only JS downloads. Downloading 300+ JS files or even just 36 for local development in 2022 is quite hard to swallow. Does the UI5 team have any plan to publish the controls/libraries/SDK (bundled ofc) on NPM for developers to consume locally? Besides the performance issue, I don't want to rely on Internet connection for local development.
I had been working on Google app engine for some time with great success. However, recently I was forced to upgrade to Eclipse-Photon from Eclipse-Mars.
I can run a debugging version of the server on localhost:8080 just fine except when I change any of the TypeScript files. Formerly when I would run the TypeScript compiler to generate new JavaScript the server would automatically update the server. Now when I generate a new JavaScript file, the server continues to serve the old version. I have my expirations set to 0 and I have automatic publication turned on.
For a while I could make it work by telling the server to Publish. Now that has stopped working as well. If I save any file from inside of Eclipse I see a little message flash by indicating publication and then that file serves properly. If I load the generated JavaScript file and then modify it slightly then it will publish and serve correctly.
Obviously Photon is no longer tracking file changes that way that Mars did. I could easily copy the generated file to the correct place if I knew where that place was.
Are you running your TypeScript compilation from outside of Eclipse? If so, try doing a Refresh of your project. That should sync up Eclipse's notion of the filesystem state with what is on disk.
Cloud Tools for Eclipse relies on the Web Tools and Resources frameworks to determine whether a resource has changed and needs publishing. Eclipse is normally set up to detect resource changes automatically as configured by two options on the Preferences > General > Workspace preference page: Refresh on access and Refresh using native hooks or polling.
I have a gwt developed website that already runs 100% client-side (by which I mean no server-side javascript is used)
As one of the options for windows universal app development is javascript, is it possible to somehow turn a online gwt app into a offline uwp one?
I am aware there are solutions to package websites together with browser+installer, but if windows can run js 'natively' now (I assume via Edge) it seems a better route.
You can use UWP Javascript project from Visual Studio. This project allows you to add any HTML/CS/JS requires files. You can also use the Hosted model, where your files are downloaded from a URL (but then the app will require connectivity).
I've not tried the scenario, but I don't see any impediments, it should work.
I've found a few post on this topic but have not been able to find the best solution.
Attempted to integrate Ionic into IBM MobileFirst (Worklight).
At the moment - I have built a normal Ionic project and moved the WWW folder in the 'common' folder. Also added in the initOptions, main.js and messages.js.
MobileFirst has an awful build process - I hate having to deploy to a mobilefirst development server + preview app for any code changes. I am hoping to get some type of auto reload working within mobileFirst, or at least develop with ionic normally and hav ea job to bring my changes into my worklight project... something that is better than me current situation.
Does anyone have a sample project that actually auto-builds or picks up code changes automatically?
Any and all help is greatly appreciated.
Not sure what do you mean by "auto-reloading"; if you make any changes to the web resources to your project inside the Studio plug-in (in Eclipse) and reload the preview in the browser, it will show the changes.
You are not required to Run As > Run on MobileFirst Development Server for each change. As long as you work on the resources in your workspace, the "auto-reloading" as you call it, should work (make sure you are using the latest available MobileFirst Studio version from the Eclipse Marketplace).
There is also a rudimentary Starter Application that is based on Ionic.
You can download it from here.
There are also several results on the subject matter when searching in Google.
The need to rebuild in order to see changes in your Web components (CSS, JavaScript, HTML) did used to be an annoyance in early versions of what was then Worklight and is now MobileFirst. I forget when the need for a rebuild was removed but certainly in Worklight 6.2 and beyond you now simply need to refresh in your browser.
UPDATE: If using MobileFirst 6.3 you need to ensure that you are on a
suitable patch level. I find that simple refresh does not work in
6.3.0.00-20150106-1717, but if I update (Help->Check for Updates) to 6.3.0.00-20150214-1702 then edit/save/refresh works as
expected.
My personal practice is always to have Mobile Web environment in my project and then choose that from the Console. This loads the application in the browser-based Mobile Simulator that you can tailor to fit your target form-factor. This has a "Go/Refresh" button that immediately reflects your edits.
Alternatively, some folks these days do not use Studio, instead they use the Command Line Interfacer. Possibly this may be more to your taste. You can download it here.
there is a solution with using staff like ionic-cli serve command + symbolic links that will replace common folder.
check here an example https://www.dropbox.com/s/4pvaulo6yo47kb9/lab_7.2.mp4?dl=0
(you just can disable sound, cause i've recorded it in russian) 7-15 minutes of this video
Other option is to organize live-preview yourself using IDE features and/or nodejs
This will work as long as you are working on front-end (mostly non-worklight api) part.
You need to include this lines in the index.html
<!-- ionic bundle & css -->
<link href="www/ionic/css/ionic.css" rel="stylesheet">
<script src="www/ionic/js/ionic.bundle.js"></script>
We are working with various cloud platform(like. salesforce etc) and we need sync with server everyday. would like to know is there way that we can in our development box to synchronize all eclipse projects through some script without opening the IDE and open the IDE without much freezing.
This would enable to do clean sync( with cloud server) and refresh with local files.
This would enable to do refresh( for non cloud server ).
running a little ant or some kind of script would have development stable unique environment across all developers?
Any help would be appreciated.
It's going to GREATLY depend on what cloud platforms you are using. HOWEVER, i work with the salesforce platform. They offer (per their dev. docs) an ant API jar that allows you to write ant scripts that can essentially check out everything in your org.
Essentially you can use it to check out and check back in pieces and parts of the website. Though this of course only works for SFDC. For other platforms you will need to refer to their API's or write your own tools.