Bouncer.js in NextJS React is Undefined - javascript

Good Day.
Banging my head here and need a pair of fresh eyes...
I have a NextJS (10.0.6) app (React 17.0.1). I'm trying to incorporate Bouncer.js validation code.
Both the bouncer.min.js file and my init() file are being pulled into the correct page,
<script src="/static/bouncer.min.js" async=""></script>
<script src="/static/bouncerLoad.js" async=""></script>
</body>
which I believe is evident because I'm getting an Undefined error.
Unhandled Runtime Error
ReferenceError: Bouncer is not defined
This is the content of my bouncerLoad.js file:
var validate = new Bouncer('contactform');
console.log("bouncer loaded");
Any suggestions?

Related

getting LC is not defined in literallycanvas

literallyCanvas works fine with ionic 3 in (browser and android) but gives Can't find variable: LC error while building ionic 3 ios app with xcode.
In my index.html i have added
<script src="//cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-with-addons.js">
<script src="//cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.js" ></script>
<script src="assets/static/js/literallycanvas.js"></script>
and in my wbBoard.ts file i have declared literallyCanvas as
declare const LC: any;
when i am trying to
console.log(LC)
i am a getting an error which says Can't find variable: LC

gzip-js does not work, Uncaught ReferenceError: require is not defined

I would like try gzip-js. and I make a html file to use function of gzip-js
I went https://www.npmjs.com/package/gzip-js, made "npm i gzip-js", as they suggested, the I got some files anf folders,then I wrote an html file(which is in the folder "\node_modules\gzip-js\lib")
<html>
<script src="gzip.js">
var gzip = require('gzip-js');
var out = gzip.zip('Hello world');
console.log(out);
</script>
<body>
</body>
</html>
I hope it will work as the website show, but I was told "Uncaught ReferenceError: require is not defined at gzip.js:4 at gzip.js:280"
in the console of my browser.

Uncaught Error: Module name "https" has not been loaded yet for context: _. Use require([])

This is the error that I'm getting-
Uncaught Error: Module name "https" has not been loaded yet for context: _. Use require([])
http://requirejs.org/docs/errors.html#notloaded
at makeError (require.js:168)
at Object.localRequire [as require] (require.js:1436)
at requirejs (require.js:1797)
at Dataverse_API_node.js:1
I have an explore.html page which calls the script Dataverse_API_node.js, which is itself dependent on the require.js file. My Dataverse_API_node.js script is supposed to display its output data on the explore.html page. However, I face the above error when I load the explore.html page.
Note that my Dataverse_API_node.js script runs independently without errors and displays the data in the command prompt when run through the Node.js command prompt.
There are the first few lines of the Dataverse_API_node.js script-
const https = require("https");
var parseString = require('xml2js').parseString;
const demo_url = "https://demo.dataverse.org"
const actual_url = "https://demo.dataverse.org/dataverse/hbstest"
const search_uri = "/api/search"
const options = "?q=*&subtree=COSgak"
This is the part of explore.html where I'm calling the Dataverse_API_node.js script and supposed to display the data-
<p>
<script src="Dataverse_API_node.js" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.5/require.js">
document.write(search_for_all("https://demo.dataverse.org", 0, 'file'));
</script>
</p>
I'm new to Javascript and would really appreciate some help with this error. Please don't send me to requirejs.org as it doesn't really help.
Thank you for your time.
Solution found. Just use browserify. Install browserify and then run the following command-
> browserify Dataverse_API_node.js > bundle.js
Browserify goes through all the 'require' in your script and wraps it up in bundle.js and helps to run the node.js modules in the browser.
Just add the following script in your .html file-
<script type=text/javascript src="scripts/bundle.js"></script>

elasticsearch.js: ReferenceError: require is not defined

I'm trying to create a project using elasticsearch.js. I'm following the docs found here.
In the <head> I've loaded:
<script src="js/jquery-1.10.2.js"></script>
<script src="js/elasticsearch.js"></script>
<script src="js/esInit.js"></script>
and in custom.js I have
var elasticsearch = require('elasticsearch');
var client = new elasticsearch.Client({
{Host Here}
});
In FB console I see
ReferenceError: require is not defined
var elasticsearch = require('elasticsearch');
I'm reading that require() is not a function of javascript. Very confused.
It looks like you are loading the version that is supposed to be used with Node.js.
There are browser compatible builds available as well: http://www.elasticsearch.org/guide/en/elasticsearch/client/javascript-api/current/browser-builds.html
Yes require is not a default function in javascript. Instead you need to download that js file from "http://requirejs.org/docs/download.html"

Uncaught Error: No module: ui.directives

I'm learning AngularJS and trying do like on video but I found problem. I've got this 2 errors:
Uncaught Error: No module: ui.directives
Uncaught Error: No module: ui.directives.sortable
In my app.js I have like they said on github:
angular.module('507917App', ['ui.directives.sortable'])
And also I've added this line to code:
<script type="text/javascript" src="modules/directives/sortable/src/sortable.js"></script>
Looking into path and there is definition for ui.directives:
angular.module('ui.directives').directive('uiSortable', [...
Question
Is there anything what I missed or do wrong? Why I've got this errors?
Try changing it to angular.module('507917App', ['ui.sortable']). It worked for me. If you look in the actual sortable.js file, that's the name of the module. I believe the developer just forgot to update that on the documentations.
Ok I found solution. Before including this script (or other component from angular-ui):
<script type="text/javascript" src="modules/directives/sortable/src/sortable.js"></script>
you need also include this:
<script type="text/javascript" src="components/angular-ui/build/angular-ui.js"></script>
also first line of app should looks like here:
angular.module('507917App', ['ui'])

Categories