Javascript files does not load in React - javascript

I included my external Javascript files in my index.html file, and for whatever reason it doesn't load, and no error is thrown.
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/jquery.easing/jquery.easing.min.js"></script>
<script src="assets/vendor/php-email-form/validate.js"></script>

I used the react-script-tag library.
I created a component that used the react-script-tag to include all the js files, and imported them in other components that needs them.

Related

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.

Including bundled webpack file in webpack build

I have a webpack bundled widget that I pack into a single file using webpack, and can use as follows:
<script type="text/javascript" src="my-bundle.js"></script>
<script type="text/javascript">
(function() {
MyBundle.render();
}) ();
</script>
This works fine, but I want to use this widget in my main Rails app. So I've copied the my-bundle.js file into my main project directory and required it.
When I run webpack on my main app, I can see that the code in my-bundle is being included in the resulting js file, but I cannot access the code. i.e. calling MyBundle gives a not defined error.
How can I access it?
EDIT - it looks like I can just use script-loader to run the my-bundle.js file once (which defines a MyBundle function). This doesn't feel like the best way to do it though

Meteor React External JS Files

I have an HTML template which is bought from Themeforest, index.html of this template has js files included in the following order:
<!-- Scripts -->
<script src="js/vendor/jquery-2.1.0.min.js"></script>
<script src="js/helper.js"></script>
<script src="js/vendor/HeadsUp.js"></script>
<script src="js/vendor/chart.min.js"></script>
<script src="js/vendor/jquery.mixitup.min.js"></script>
<script src="js/vendor/jquery.swipebox.min.js"></script>
<script src="js/vendor/masonry.min.js"></script>
<script src="js/vendor/swiper.min.js"></script>
<script src="js/vendor/materialize.min.js"></script>
<script src="js/main.js"></script>
</body>
How and where should I include these external js files in my Meteor React application?
As mentioned in this meteor documentation, you can create a compatibility folder from on client.
This folder is for compatibility with JavaScript libraries that rely on variables declared with var at the top level being exported as globals. Files in this directory are executed without being wrapped in a new variable scope. These files are executed before other client-side JavaScript files.
It is recommended to use npm for 3rd party JavaScript libraries and use import to control when files are loaded.

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.

jangaroo loader index.html file

In the Jangaroo tutorial using Maven it states"include a Jangaroo application script generated by the Maven build process". This should be created in src/main/webapp/index.html, it isn't. Can anyone explain this, or what in the pox.xml is missing?
Thanks
The misunderstanding here is that actually, the Jangaroo application script is generated, not the index.html file.
The idea is that your index.html usually contains custom HTML, e.g. loading your CSS or setting up some context. The only Jangaroo-specific things your HTML code has to do is load the generated joo/jangaroo-application.js script and run the application's main class, using its fully-qualified name (in this example, HelloWorld is in the top-level package):
<script type="text/javascript"
src="joo/jangaroo-application.js"></script>
<script type="text/javascript">
joo.classLoader.run("HelloWorld");
</script>
https://github.com/CoreMedia/jangaroo-tools/wiki/Tutorial-~-Deployment

Categories

Resources