External JavaScript files not working in Rails - javascript

I have created a new Rails 4 project and I am trying to load an external JavaScript file in my HTML file. I have placed the JavaScript file in the /assets/javascripts directory and included the file in my HTML file.
My HTML file:
<html>
<body>
<script src="/assets/hello.js"></script>
</body>
</html>
My JavaScript file:
document.write("test");
I do not see any errors in my web browser console when loading the website. I am pretty sure I put the JavaScript file in to correct directory but the file will not run. Does Rails require something for external JavaScript files to work properly?
I have also tried defining a method in the JavaScript file and calling it within a <script> tag but I get a "Uncaught ReferenceError: methodname is not defined".

You probably need to list 'assets/hello.js' in application.js. The Rails asset pipeline compiles all JavaScript into application.js based on the filepaths that it finds listed there.
More info here: http://railsapps.github.io/rails-javascript-include-external.html

So I figured out why Rails wasn't loading my JavaScript file. When I created the Rails project, it included .coffee scripts which can be used instead of JavaScript. For some reason by default, the .coffee script was being run instead of the JavaScript file that I created. After deleting the .coffee script, my JavaScript loads as expected.

Related

Angular - How to reference an external javascript file at build time?

After I build my angular app, I have to perform one last manual step to get my program to run: The platform it runs on has a requirement that its javascript file is in the <head> of the html file that is running. Their .js is on a CDN. So basically, post-build, I have to open up index.html and add the following:
<script src="https://cdn.fragilecorp.com/lib/js/platform.js" type="text/javascript"></script>
Is there a way I can accomplish this automatically using angular configs or a different way?
Yes, in .angular-cli.json (.angular.json in older versions), I believe you can add what's inside of src to the scripts array.
Check this out:
How to include external JS file to angular5?

Exporting JS code from NodeJS HTML files to JS files

I am new to Nodejs and having trouble when trying to export my js code which exists in HTML files to more js files for less redundancy in code (same js code in two HTML files):
I exported the js code from both HTML files to js a file (js_code_file.js for example) and tried using <script src="js_code_file.js" type="text/javascript"></script> in the header of the HTML file in order to import the file, and it did not work.
Is it because of Nodejs? and if it is - is there a way to "require" these files somehow?
<script src="js_code_file.js" type="text/javascript"></script>
Looking at the src attribute, js_code_file.js has to be in the same path as the .html file referencing it; that is, it has to literally be in the same folder. So make sure that is the case, otherwise, update your question with any errors you might be receiving.

adding.js file in ejs file

I'm working on a simple project where I included a simple js file to fetch out a data from api on click of a button. It was working when I had HTML file and js file in same folder and used by simply clicking on index.html . Now i am using expressjs for same and written all the HTML code in index.ejs file. For some reason, the js file has stopped working. I have tried changing the paths and carefully defining the path, also kept the file in same folder as of ejs file but it does not seem to work. Any suggestions would be helpful. The lines I have included in ejs file as are as follows. Here the js file is in the js folder of public folder of the project
<script src="jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="js/script.js"></script>
I got this problem resolved by adding the following path to jQuery src
"https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"
instead of
"jquery-3.2.1.min.js"

Importing javascript files on WaveMaker

We have been using WaveMaker and wanted to know how we can go about importing an external javascript file using the platform ?
The external JS file should be imported into a folder in resources
The file path has to be given in login.html of the Web-App
The file path should be of the form "/projectname/foldername/filename.js/"
The functions in the external JS file can be accessed in the login page through its script and the function invoked here is from a sample js file.
The following works if using WaveMaker 6. This probably doesn't work with newer versions of WaveMaker.
Instead of having to add it to each project, try editing index.html in the webapproot directory and add you external js file:
<!-- Boot Wavemaker -->
<script type="text/javascript" src="config.js"></script>
<script type="text/javascript" src="/<path to javascript file>/sha512.js"></script>
Then, in order to have this work correctly in your development environment, add a context tag to server.xml just above the projects directory:
<Host appBase="webapps" autoDeploy="true" name="localhost" unpackWARs="true" xmlNamespaceAware="false" xmlValidation="false">
<Context docBase="c:/<Path To Javascript Filet" path="<path to javascript file matching whats in index.html>" reloadable="true"/>
</Host>
In the above Context tag, docBase is the local folder with js and path should match the path placed in index.html.
Doing this you can use the javascript file across all projects without having to add it to resources in the project.

Compiling CoffeeScript from Multiple Files

Im looking for a way to compile all of my coffeescript files, currently in individual files such as features.coffee // scroll.coffee etc etc, in to one main outputed .js file.
Im using an application.coffee file at current to act as the main file. Ive imported my various files using:
#= require features.coffee
#= require scroll.coffee
However when Im outputting the application.coffee to application.js on the code from within the application.coffee is outputting and not that of the imported files
Im assuming that coffeescript imports are not native features and that some sort of plugin will be needed
Thanks in advance
You have to manually merge the source files into a main script file ( aka concatenate them ), then compile to JavaScript. You have not specified what you are working with, but in node.js, the require function only executes an external script ( to put it very simply ), it does not place the source code into current file as you seem to be expecting.
There are many tools on the network to concatenate your source code into a single main script - just google around and find what suits you best.

Categories

Resources