inculded angular-google-places-autocomplete in my project for places autocomplete using
bower install angular-google-places-autocomplete
shows an error in the console
Global `google` var missing. Did you forget to include the places API script?
following the kuhnza/angular-google-places-autocomplete documentation included below script manually in the index.html
<script src="https://maps.googleapis.com/maps/api/js?libraries=places"></script>
then every works fine , but when moving to production app is build using grunt build then minified and uglified files are created the the same error reappears.
i think the manually added script is removed during building the app.
what to do to solve this issues.how to include this google places api in application properly.Thanks in advance
You need to move your script for google api call before your build:js in the index.html declaration
Related
In my MVC5 web application I use two bundles for a page, one contains the common JavaScript files for all the pages and the other bundle is specific for the page. This works fine in development environment but the page specific bundle does not load in the staging. The Rendered script tags are as below.
<script src="/bundles/jsAll?v=72eJMPeVrT1mvbZw1VAU7y6r7vodOImt5NOMq4Gcp581"></script>
<script src="/bundles/my-page?v="></script>
Could not figure out why this happens...
The problem was locally this works because all the files are available, but did not work after deployment because the script file was not included to the project, hence the file does not get deployed to the destination. Since the file is missing the bundle has nothing to serve, so there won't be a version nor content.
I am going to be working on an angular project without internet access, so my links to the cdn will not function. I would like to save the angularjs library to a folder inside of my project. Here is what I have tried:
I went to the cdn link, copied all of the text, pasted it into a file, and saved that file as angular.min.js . I then commented out the script tag for the cdn in my index.html file, and put in a new script tag specifying the path to the new saved file. When I open my project, I get the error "Uncaught ReferenceError: angular is not defined."
Here are the relevant pieces of my project's file/folder structure:
project
|_core
| |_public
| |_app
| |_index.html
|_libraries
|_angular.min.js
And here is my script tag:
<script src="./../../../libraries/angular.min.js"></script>
And here is the link to the cdn from which I copied the text:
https://ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js
Are you using a local webserver of any kind? Angular and many scripts need to be loaded from http and not file://. For this, you could use python's SimpleHTTPServer: python -m SimpleHTTPServer 8080 -- will open an http server on http://localhost:8080, open the url in your browser and you should be good to go. Also note that the order in which you load the scripts in your HTML is important, and Angular needs to be loaded before all modules of code that use it.
<script src="../../../libraries/angular.min.js"></script>
How about this ?
Have you just tried this?
<script src="/libraries/angular.min.js"></script>
Maybe your server start website (localhost:80) from the root of your project
You can use Grunt task to minify and concatenate all files. You can read the docs of GruntJS. Very useful.
http://gruntjs.com/sample-gruntfile
see the concatenate section.
if you do that manually you have check the sequence of lib files. Angularjs lib need to be on top.
There are chances of errors.
yes just to include a file you don't need Grunt
check in chrome inspect developer tool in network tab if your file angular.min.js loaded properly. If not you can change the path and try but if it is loading and still you are getting same error so please create jsfiddle or plunker of your file so that we can look it in detail.
When I left click and select view page source on my webpage it shows many many scripts included.
Is there any way where you can minify all those scripts so that all the files won't be shown seperately.
Is there any meteor command which does so?
If you have deployed manually using build and have this issue try using --production flag when building your app
thanks for your time! I am battling to get any scripts running in the Ionic framework's sidemenu starter template. I have placed them everywhere (except where they're supposed to be, clearly) but to no avail. I have tried loading them before ionic and also using a lower version of jquery. I have built a decent mobile site with jquery that I've pushed through phonegap and it works perfectly but I would like to use Ionic as a personal challenge. However, I can't seem to get any of the scripts I'm using to work.
Do I include them in the main index file and if so, do they get loaded when each template instantiates? Or must I include them in each of the templates? If you could please be quite specific as to where in the folders I should place them (if indeed there is a specific place) and also where I should call the scripts.
I installed ionic using this yeoman generator https://github.com/diegonetto/generator-ionic if that helps.
If I have note been clear enough please comment and I will elaborate further.
Thank you for your patience - J
I know this is old, but for those who are struggling with this for Ionic 2, add script files to src/assets/scripts, then refer to them via a script tag in src/index.html (not the one in www). When it builds, everything in src/assets will be copied to www/assets, including your scripts. index.html will also be copied to www.
<!-- cordova.js required for cordova apps -->
<script src="cordova.js"></script>
<script src="assets/scripts/openpgp/openpgp.js"></script>
<script src="assets/scripts/openpgp/openpgp.worker.js"></script>
I would add any scripts such as jquery either just before or just after the script tag for cordova. This is in index.html located within the app/ directory of the project that running the yeoman generator created.
<!-- Place scripts such as JQuery here -->
<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>
<script src="scripts/config.js"></script>
<script src="scripts/app.js"></script>
<script src="scripts/controllers.js"></script>
Once you have placed the scripts here they will get called when the app runs, and libraries such as jquery will be available globally throughout the app. I hope this helps.
As nice listed by a user here https://github.com/ionic-team/ionic/issues/9422
Install latest ionic
Start your project
Go to /src/
open the assets folder
create a /js/ folder inside assets
copy your .js inside this js folder
goto /src/index.html
Add your path
Go to your typescript file of choice and declare var N;
N.yourFunction
ionic serve
I'm trying to make a web application but i keep getting the error:
Uncaught ReferenceError: Platform is not defined
In the polymer.js file I downloaded from the website. How do H fix this?
I tried to re-download it and redid the import, which got rid of the other errors but this one persists.
You need to also load platform.js (the polyfills). Make sure it is the first script loaded on your page and comes before any HTML imports:
<script src="bower_components/platform/platform.js"></script>
The basic setup is here: http://www.polymer-project.org/docs/start/usingelements.html#using
More info here: http://www.polymer-project.org/docs/start/getting-the-code.html
platform.js was replaced now for webcomponents.js
If you are sure that is all right with your section and even so the error remains, there is something wrong with your environment (maybe some incompatibility between different versions of components or scritps).
Clear and download all your components and scripts again from the sources. I recommend use of Bower for that. Just wipe your repository and make a fresh bower install.