After updating dartium to 0.4.7.1_r21548 (same for 0.5.0.1_r21823) i am unable to debug anymore. I have written a small test and discovered that the breakpoints are hit if i call the file direct. But if i use a server and call the page (http://localhost:8080/test.html) the dart code works perfectly, but the breakpoints are missed!
I am not debugging with dart-editor. Only dartium is used.
Here is my test:
test.dart
void main() {
print("hallo");
}
test.html
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Test</title>
<script type="text/javascript" src="packages/browser/dart.js"></script>
<script type="application/dart" src="test.dart"></script>
</head>
<body>
Hallo
</body>
</html>
This appears to be a bug in the Dart Editor that a bunch of people have run into.
We're currently looking into it.
You can follow the bug about this, here: https://code.google.com/p/dart/issues/detail?id=10215
Related
I'm struggling with deploying Angular 4 project built with cli to a Spring boot server.
In the .angular-cli.json I added outdir property, which points to a custom folder inside Spring webapp folder, which is accessible directly in the server (webapp/main).
The cli build command I'm using is:
ng build --base-href /main/ -a main
Which creates the main folder in the webapp, with the index.html containing the following script tags:
<base href="/main/">
...
<script type="text/javascript" src="inline.bundle.js"></script>
<script type="text/javascript" src="polyfills.bundle.js"></script>
<script type="text/javascript" src="vendor.bundle.js"></script>
<script type="text/javascript" src="main.bundle.js"></script></body>
which means that these files will be requested with /main prefix, e.g localhost:8080/main/inline.bundle.js
Which is fine for a basic app, but becomes an issue when routes are added to the angular app (In Spring, I'm serving the index.html for all paths with /main, to allow the angular routes to work properly, which cause a redirect loop for the bundles, as they are starting with /main as well.
How can I force the generated script tags to use a custom location? Or at least specifiy the absolute location, and not relay on the base href (so I can change the outDir property to main-app, and problem solved).
The desired solution would be something like this:
<script type="text/javascript" src="/main-app/main.bundle.js"></script>
I thought of maybe adding a script that will execute after the ng build which will modify the script tags, but it's a dirty solution, and also won't work with ng build --watch, which is crucial for development...
For reference, here is the Spring controller function that maps the /main requests:
#RequestMapping("main/**")
public String mainRoute(HttpServletRequest request) {
return "/main/index.html";
}
Thanks!
Here is ng build wiki: https://github.com/angular/angular-cli/wiki/build
please use --deploy-url="/main-app/" option. this will generate:
<script type="text/javascript" src="/main-app/inline.bundle.js"></script>
<script type="text/javascript" src="/main-app/polyfills.bundle.js"></script>
<script type="text/javascript" src="/main-app/scripts.bundle.js"></script>
<script type="text/javascript" src="/main-app/styles.bundle.js"></script>
<script type="text/javascript" src="/main-app/vendor.bundle.js"></script>
<script type="text/javascript" src="/main-app/main.bundle.js"></script>
I am running into a similar issue where I used ng build and it generates files(index.html, main.js, polufills.js , styles.js etc) in output path(have set this path in angular.json) - resource/static/. But I can't see any UI when starting tomcat on localhost:8080/ . I believe it's not able to load any of the static files, not sure what I missed or how can we make deployment easier.
I made a controller to serve the front-end part:
#GetMapping("/")
public String index() {
return "forward:/index.html";
}
My index.html:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Hello App</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root></app-root>
<script type="text/javascript" src="runtime.js"></script><script type="text/javascript" src="polyfills.js"></script><script type="text/javascript" src="styles.js"></script><script type="text/javascript" src="vendor.js"></script><script type="text/javascript" src="main.js"></script></body>
</html>
But still no user interface when tomcat is running. Even though I used ng build --deploy-url="/" it created scripts in index.html as
<script type="text/javascript" src="/runtime.js"></script>
<script type="text/javascript" src="/polyfills.js"></script>
<script type="text/javascript" src="/styles.js"></script>
<script type="text/javascript" src="/vendor.js"></script>
<script type="text/javascript" src="/main.js"></script>
Still no luck in getting it to show any UI content on http://localhost:8080/
I am wondering how Apache Mesos implements the front-end web ui (localhost:port) in which users can track the system's current status and the submitted jobs. Is there any library for this? How does Mesos do this (in C++)?
Well, having a look at the source code reveals what it's using:
<!DOCTYPE html>
<html lang="en" ng-app="mesos">
<head>
...
<link href="/static/css/bootstrap-3.3.6.min.css" rel="stylesheet">
...
</head>
<body>
...
<script src="/static/js/jquery-1.7.1.min.js"></script>
<script src="/static/js/underscore-1.4.3.min.js"></script>
<script src="/static/js/zeroclipboard-1.1.7.js"></script>
<script src="/static/js/angular-1.2.3.min.js"></script>
<script src="/static/js/angular-route-1.2.3.min.js"></script>
<script src="/static/js/ui-bootstrap-tpls-0.9.0.min.js"></script>
...
</body>
</html>
So, it's using
Angular
jQuery
Bootstrap
I'm trying to achieve a tab animation such as the one in this example:
http://codepen.io/calendee/pen/IAjoL
<html ng-app="ionicApp">
<head>
....
<link href="http://code.ionicframework.com/0.9.27/css/ionic.min.css" rel="stylesheet">
<script src="http://code.ionicframework.com/0.9.27/js/ionic.bundle.min.js"></script>
</head>
<body>
<ion-nav-bar animation="nav-title-slide-ios7"
type="bar-positive"
back-button-type="button-icon"
back-button-icon="ion-arrow-left-c"></ion-nav-bar>
<ion-nav-view animation="slide-left-right"></ion-nav-view>
........
</body>
</html>
but if i try this using the includes of the current version 1.0.0 it does not work.
Any clue?
Thanks!
I just stumbled upon this yesterday: http://ionicmaterial.com/ and find it quite cool. Take a look, you may find it useful - ping back if indeed you do.
I wrote (copied) a first program in WebMatrix. I selected EmptySite template and in Page.cshtml I typed 2 lines. Finaly, the code in Page.cshtml looks like this:
#{
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<h1>Welcome to the WebMatrix!</h1>
<p>I began to become a web developer on #DateTime.Now.ToString()</p>
</body>
</html>
I pressed "Run" but I got an empty web-page. Nothing is written on it. I received no error message.
Well, what's wrong ?
Thanx,
Eb_Cj
You seem to be going to the default document rather than your page. You can solve this in two ways: either right click on the Page.cshtml node in the project explorer within WebMatrix and select Launch in browser or manually change the URL in your browser to localhost:25776/Page.
I'm trying to embed a Vimeo video using fancyBox 2. I'm able to make the lightbox pop up, but all I get is a spinning loading icon that lasts forever.
I did a bunch of searching on similar Vimeo questions here on StackExchange, but implementing things others suggested has not solved the issue.
I've now even created a fresh test site (plain HTML doc with linked files in local directory), and then used the code listed in the fancyBox documentation section on using Media Helpers (Extended Functionality) line-for-line, but that's not working either. Same loading spinner, stuck forever.
Does anyone have any ideas why this is not working? Testing in both Safari 7 and Chrome. In Safari I get the stuck loading spinner. In Chrome I get an error page within the lightbox that says "The file or directory could not be found."
Here's my code:
<!DOCTYPE HTML>
<head>
<!-- Add jQuery library -->
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<!-- Add fancyBox -->
<link rel="stylesheet" href="js/fancybox/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
<script type="text/javascript" src="js/fancybox/jquery.fancybox.pack.js?v=2.1.5"></script>
<!-- Add fancyBox media helpers -->
<script type="text/javascript" src="js/fancybox/helpers/jquery.fancybox-media.js?v=1.0.6"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.fancybox-media').fancybox({
openEffect : 'none',
closeEffect : 'none',
helpers : {
media : {}
}
});
});
</script>
</head>
<body>
<a class="fancybox-media" href="https://vimeo.com/78112273">Video</a>
</body>
All I get with that is a stuck spinner and an error page.
Any help and suggestions are greatly appreciated! Thank you!
Ensure your page has a valid DOCTYPE and most importantly, note that the case seems to impact on whether the video actually gets loaded when the popup is displayed. (You need lowercase 'html' in the doctype declaration)
ie. Using:
<!DOCTYPE html>
<html>
<head>
fixed it for me... This is probably why your example works in jsfiddle.