I am sorry to ask this silly question. I am trying to use pathfinding.js (https://github.com/qiao/PathFinding.js/) in ionic for my navigation.html page (a partial file located in the www/templates/ directory) but it's not working with partials files except with index.html root file only. However, it gives me error if I use it in the index.html root file, maybe because it needs to draw a svg in the navigation.html page, but it could not find the navigation.html page since it is in the index.html (dependency with the navigation.html)
I am thinking to use bower, but can bower solve this problem?
In index file add the script tag to add scripts.
<script src="./templates/PathFinding.js/">`
It will get loaded.
However, if you use Bower.. Bower will only download the files to src folder .. then you need to manually add script tags for script into the index.html.
Related
I have an angular app, to this I am trying to add an npm package called svgedit. It gets installed. But when I try to reference a java-script file it says
net::ERR_ABORTED 404 (Not Found)
This is how I am trying to reference it in my index.html in the head section,
<script type="module" src="node_modules/svgedit/svgedit-config-es.js"></script>
I can access this file from within vs code by clicking "ctrl + left mouse". It opens the file properly meaning the reference is proper. But when it runs it gives the above mentioned error in the console. I have also tried switching the type attribute to "text/javascript".
Basically I am trying to integrate this package in my angular app. What is the correct method to go about it.
ng serve will only serve compiled files from your src directory and what''s in the assets folder. It will not serve node_module files directly.
The usual way to add scripts it to add it to the scripts section in angular.json
scripts:
[ //other scripts
"node_modules/svgedit/svgedit-config-es.js"
]
Is your html page in the root directory of your project? if not make sure to navigate to the file correctly. if the html page in the root directory of your project then there must be a typo in the src
Basically I am trying to integrate this package in my angular app. What is the correct method to go about it.
The right way to go about it is to use a bundler like webpack, rollup etc...
I am trying to build a PDF viewing component for an Ionic 2 app. I have lots of experience of Angular 2, but not of Ionic.
The component will be built using pdf.js and have created the pdf.js asset to be included in my project as described on the github page. However, trying to require this fails — require is not defined —, so I copied the script to the asset folder and tried importing it. It seems the file is not being copied to the build so that fails too.
Anyone have any pointers for requiring or importing a non-weboack non-SystemJS script into an Ionic 2 app?
Create a js folder (or something like this) in the www folder; include the files needed and reference them from there. This folder is not emptied on build.
EDIT
The root of the www folder does not change and you can reference it as someting like ... 'js/need-this.js'.
There should have some references in your index.html file to the build folder and maybe the assets folder (icon); this concept of using a js folder works the same. Only build and assets will change.
I feel that I should point out that you shouldn't copy anything into www since this is autogenerated and any changes will be overwritten. You should copy into assets instead.
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.
I have a jquery library in my project but need to put it in linux /usr/share/js directory and not inside of my project directory.
Is there a way to do a linking in the index.html?
Including in the index.html:
<script src="/usr/share/js/jquery.min.js"></script>
doesn't help, as it looks into my working dir and I don't have a 'usr' dir
/usr/share is in the root directory and not in my working one. I don't use any php or the stuff, is there a simple way to solve this?
You need to back out of the file you are currently in by using the ../ command which goes back one directory. Depending on how many files deep the index.html file is in your project, you may need more then one like so:
<script src="../../../../usr/share/js/jquery.min.js"></script>
This will direct you 4 files out of where your index.html file is located, you may need more or less depending just do some searching through your directories and adjust accordingly.
You can create symlinks for files like this, to allow access to serve from not your document root.
The web server is also needs to be configured to follow symlinks when serving.
More info for Apache:
http://httpd.apache.org/docs/2.4/urlmapping.html
I have copy and pasted the css and js files for Copy Bundle Resources and removed them from Compile Sources.
How do I "link" or "import" them so I can use the css and javascript files?
Can anyone enlighten me?
First, make sure that you have the right links to your css & javascript files when you move them into your xcode project. If and when you have made a project in xcode, you should be able to view your project directory in finder. From there, navigate to the www folder and make sure that all of your code is pasted into this folder. Also, make sure that your home page is named "index.html" as this is how xcode will find the correct html page to display upon booting.