I am working to create an Angular 6 application. Locally everything works great. I hosted the site. I had a friend check on their end if the application works, and it does. No error or anything. On my end I am getting errors in bootstrap, polyfills.js, vendor.js, and main.js.
bootstrap(141,1) error:
Object doesn't support property or method 'bind'
vendor.js(258,13) and polyfills.js(7442,5) all have the error:
Expected identifier, string or number
main.js(1151,6):
Expected identifier
But I believe all issues are rooted with main.js
The code snippet from the error main.js
if (_environments_environment__WEBPACK_IMPORTED_MODULE_3__["environment"].production) {
Object(_angular_core__WEBPACK_IMPORTED_MODULE_0__["enableProdMode"])();
}
Object(_angular_platform_browser_dynamic__WEBPACK_IMPORTED_MODULE_1__["platformBrowserDynamic"])().bootstrapModule(_app_app_module__WEBPACK_IMPORTED_MODULE_2__["AppModule"])
.catch(function (err) { return console.error(err); });
/***/ }),
index.html:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>IdmStatus</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>
The error is pointing at the .catch line.
I'm not sure what would be causing this. Any help is appreciated
Related
The below code works fine in browser but when I try to run via node (in command prompt), it give error : Uncaught SyntaxError: Unexpected identifier
Please find the screenshot attached for an error.
//index.js
// This is my first JS code
console.log('Hello World');
//index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h1>Hello World</h1>
<script src="index.js"></script>
</body>
</html>
Found the problem. I started a node then ran below commands:
node
node index.js
All I had to do is just go to the directory and run this single command >>
node index.js
I'm trying to download the source of https://outline.com/rUdmgC. (I want to get the same file I get when I save that url using Chrome.)
I first tried wget and curl, which didn't work. (By didn't work, I mean the downloaded source was mostly empty; The page probably uses Javascript to create its content.)
Then I did some googling, and tried this https://gist.github.com/giocomai/247d54e097b5083e2451. It didn't work, and exited with these exceptions:
TypeError: undefined is not a constructor (evaluating 'suffix.startsWith('http:')')
https://outline.com/app.js:20767
https://outline.com/app.js:17217
https://outline.com/app.js:17113 in onEachEvent
https://outline.com/app.js:17210 in value
https://outline.com/app.js:18695
https://outline.com/app.js:18792
https://outline.com/app.js:19000 in each
https://outline.com/app.js:18792 in toggle
https://outline.com/app.js:18683
https://outline.com/app.js:19498 in mountTo
https://outline.com/app.js:19638 in pushTags
https://outline.com/app.js:19000 in each
https://outline.com/app.js:19642 in pushTags
https://outline.com/app.js:19693 in mount
https://outline.com/app.js:20112
<!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml" xmlns:og="http://opengraphprotocol.org/schema/" lang="en" class=" js csstransforms3d csstransitions" style=""><head>
<title>Outline - Read & annotate without distractions</title>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no,height=device-height">
<meta name="description" content="Outline is a free service for reading and annotating news articles. We remove the clutter so you can analyze and comment on the content.">
<meta name="keywords" content="clean links readable readability medium typography annotations annotate">
<link rel="chrome-webstore-item" href="https://chrome.google.com/webstore/detail/daoolpmoieinofbnddaofhkhmbagfmnj">
<link rel="stylesheet" href="https://outline.com/css/outline.css?v=1.0.1">
<link rel="shortcut icon" href="https://outline.com/favicon.png">
<!--[if lte IE 8]><script src="js/html5shiv.js"></script><![endif]-->
<script async="" src="https://www.google-analytics.com/analytics.js"></script><script src="https://outline.com/js/modernizr.custom.js"></script>
<script src="https://outline.com/app.js"></script>
<script async="" src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-2748618594698147",
enable_page_level_ads: true
});
</script>
<style type="text/css">.yue { max-width: 650px; margin: 0 auto; }</style></head>
<body>
<outline-app></outline-app>
<script>
var riot = require('riot')
require('initialize')
</script>
</body></html>
What can I do?
Oh yes, it does. To see the resulting page you should open the page in browser and see it in the developer mode.
I made a angularjs HTML SPA that works fine.In a specific situation I need the power of a HTA. As far as I know there are no restrictions in using a HTA in combination with angular or any other valid HTML. Nevertheless I get an error when using the line
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
in a HTA, even when it's the only script tag in the header.
The error message is: Script error, Code 0, URL http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js
I would expect that others have encountered this error before but I can't find anything on stackoverflow.Does anybody recognize this problem? Is there a solution or workaround?
<!DOCTYPE html>
<html lang="en-US" ng-app="myApp" ng-controller="myCtrl">
<head>
<HTA:APPLICATION
APPLICATIONNAME="my app"
SINGLEINSTANCE="yes"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body>
<div >
...Do something
</div>
</body>
</html>
You have declared ng-app and ng-controller on HTML element, but its handlers are not defined. Also, as noted in comment, you must elevate implicit IE version to use sane JS engine with X-UA-Compatible meta. Adding those two lines fixes described error:
<!DOCTYPE html>
<html lang="en-US" ng-app="myApp" ng-controller="myCtrl">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge" />
<HTA:APPLICATION
APPLICATIONNAME="my app"
SINGLEINSTANCE="yes"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.js"></script>
<script>angular.module('myApp',[]).controller('myCtrl',['$scope',function($scope){}])</script>
</head>
<body>
<div>
...Do something
</div>
</body>
</html>
I am trying to implement the stellar plugin and far as I can see, I have included all the necessary js. However, in the dev tools console I keep getting the 'Uncaught TypeError: $(...).stellar is not a function'.
This is what I have in the head tags:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UFT-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>QE | Welcome</title>
<link rel="stylesheet" href="css/foundation.css" />
<link rel="stylesheet" href="css/stuff.css"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js"></script>
<script src="js/jquery.stellar.js"></script>
<script src="js/scrip.js"></script>
<script src="js/jquery.nicescroll.js"></script>
And this is is the scrip.js file that the error is referring to:
$(document).ready(function() {
$(window).stellar();
});
$(document).ready(
function() {
$("html").niceScroll({
cursorcolor:"rgba(30,30,30,.5)",
zindex:999,
scrollspeed:100,
mousescrollstep:50,
cursorborder:"0px solid #fff",
});
});
Please help me
I have found out that the problem was with js/vendor/jquery.js which was I forgotten that had placed that at the bottom of the index.html file. When I removed it, the stellar function worked. Not sure why that affects stellar.js though.
Add javascript links to the Layout Page.
Remove script links from the inner page
I'm starting on learning EmberJS and I see this error in the console :
Uncaught TypeError: Cannot call method 'proto' of undefined ember-1.0.pre.min.js:17
It seems that just by including the library I get that error. Does anyone have any idea why I get that ?
EDIT : Added HTML Markup
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title></title>
<meta name="description" content="">
<meta name="author" content="">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="/favicon.ico">
<link rel="apple-touch-icon" href="/apple-touch-icon.png">
<link rel="stylesheet" href="css/style.css?v=2">
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<script type="text/x-handlebars">
{{#view App.MyView}}
<h1>Hello world!</h1>
{{/view}}
</script>
<!-- The missing protocol means that it will match the current protocol, either http or https. If running locally, we use the local jQuery. -->
<script src="js/libs/jquery-1.7.2.min.js"></script>
<script>window.jQuery || document.write('<script src="js/libs/jquery-1.7.2.min.js"><\/script>')</script>
<script src="js/libs/handlebars-1.0.0.beta.6.js"></script>
<script src="js/libs/ember-1.0.pre.js"></script>
<script src="js/app.js"></script>
</body>
</html>
Also there's this JS in the app.js file :
var App = Em.Application.create();
App.MyView = Em.View.extend({
mouseDown: function() {
window.alert("hello world!");
}
});
but it has been removed and all the templating part from the HTML as well, and I still got the same error (:
From the Ember Documentation:
Every Ember app should have an instance of Ember.Application. This
object will serve as the globally-accessible namespace for all of the
other classes and instances in your app
The key here is "global". Here's an example of an application:
window.App = Ember.Application.create();
Your problem is the var-keyword on your Application.create. Remove that and add Window to make the error disappear.