I am trying to include CodeMirror Plugin but am getting this error
Uncaught ReferenceError: CodeMirror is not defined
My HTML CODE is here
http://pastie.org/4673008
Can anyone help ??
Thanks in advance..
You're loading the clike module before CodeMirror itself.
Change the order in your HTML head from this:
<script type="text/javascript" src="../CodeMirror-2.33/mode/clike/clike.js"></script>
<script type="text/javascript" src="../CodeMirror-2.33/lib/codemirror.js"></script>
<script type="text/javascript" src="../CodeMirror-2.33/mode/javascript/javascript.js"></script>
To this:
<script type="text/javascript" src="../CodeMirror-2.33/lib/codemirror.js"></script>
<script type="text/javascript" src="../CodeMirror-2.33/mode/clike/clike.js"></script>
<script type="text/javascript" src="../CodeMirror-2.33/mode/javascript/javascript.js"></script>
ngx-codemirror SQL high-late is not working, deeper I found the to the code mirror tag the class to high-late syntax cm-default, cm-link, cm-keyword these class is not appending.
config used :
public queryConfig = {
lineNumbers: true,
theme: 'twilight',
mode: 'text/x-sql',
lineWrapping : true,
autoFocus: true
};
The main.ts file added the imports below:
The angularcli.json file added the scripts below:
Related
My HTML file:
<!DOCTYPE html>
<head>
...
</head>
<body>
...
<script src="script.js"></script>
</body>
My JavaScript file - script.js:
import * as FilePond from 'filepond';
const myPond = FilePond.create({
multiple: false,
name: 'filepond'
});
document.body.appendChild(pond.element);
But error occurred, the browser said:
Uncaught SyntaxError: Cannot use import statement outside a module
So I edited the script.js into this:
const FilePon = require('filepond')
const myPond = FilePond.create({
multiple: false,
name: 'filepond'
});
document.body.appendChild(pond.element);
But error occurred again, the browser said:
Uncaught ReferenceError: require is not defined at script.js:1
How can I fix it?
It's simple:
Just include the FilePond css & js file from CDN instead like:
<link href="https://unpkg.com/filepond/dist/filepond.css" rel="stylesheet">
<script src="https://unpkg.com/filepond/dist/filepond.js"></script>
Next, you do not need any import or require. You can simply use the rest of the code as FilePond is globaly declared now like:
const myPond = FilePond.create({
multiple: false,
name: 'filepond'
});
document.body.appendChild(myPond.element);
<link href="https://unpkg.com/filepond/dist/filepond.css" rel="stylesheet">
<script src="https://unpkg.com/filepond/dist/filepond.js"></script>
require() is a NodeJS function, not a browser JS function.
If the package uses npm, chances are its made for NodeJS and not browser JS.
If you want to include js files in the browser, you need to use html includes:
<script src="script.js"></script>
Or a templating solution which allows to include other files such as EJS
Actually, require() is for Node.js. You can't use it in browsers.
First solution:
Add the type="module" attribute to the <script> tag.
So it will be <script type="module" src="script.js"></script>
Second solution:
Just add <script src="https://cdn.jsdelivr.net/npm/filepond#4.13.6/dist/filepond.js"></script> and <link href="https://unpkg.com/filepond/dist/filepond.css" rel="stylesheet"> before calling script.js
I think this will work for you:
<script src="https://cdn.jsdelivr.net/npm/filepond#4.13.6/dist/filepond.js"></script>
<link href="https://unpkg.com/filepond/dist/filepond.css" rel="stylesheet">
<script>
const myPond = FilePond.create({
multiple: false,
name: 'filepond'
});
document.body.appendChild(pond.element);
</script>
I have paperscript code in offset-utils.js file. It contain:
var OffsetUtils = new function() { ... }
I load it in index.html:
<script src="vendor/vendor.js"></script>
<script src="utils.js"></script>
<script src="offset-utils.js" type="text/paperscript" canvas="canvas" ></script> <!-- -->
<script src="index.js"></script>
paper.js is included in vendor.js
In my code in index.js I got error
Uncaught ReferenceError: OffsetUtils is not defined
How I can load my paperscript library for use it in javascript code?
If you're declaring it with var then it's local to that source file. You need to export it, like:
window.OffsetUtils = new function() ...
I am using the BigText library to expand text inside my divs.
I have copied the file on my webserver and included it as following:
<script type="text/javascript" src="../js/vendor/jquery-1.9.1.min.js"></script>
<script src="../js/imgLiquid-min.js"></script>
<script type="text/javascript" src="../js/fullpage/vendors/jquery.slimscroll.min.js"></script>
<script type="text/javascript" src="../js/fullpage/jquery.fullPage.js"></script>
<script type="text/javascript" src="../js/fullpage/examples.js"></script>
<script type="text/javascript" src="../js/jquery-bigtext.js"></script>
<script src="../js/modernizr.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#fullpage').fullpage({
var bt = BigText.noConflict(true);
$.fn.bt = bt.jQueryMethod;
$('.referencesProductHeader').bigtext();
});
</script>
When running the code I get the issue:
Uncaught Syntax Error: Unexpected token ILLEGAL (jquery-bigtext.js)
Why should there be a syntax error? I just have copied the file.
And the issue:
Uncaught ReferenceError: BigText is not defined.
What am I doing wrong? I have followed the steps of the samples...
In my HTML I have the following scripts in the header:
<script type="text/javascript" src="scripts.js"></script>
<script type="text/javascript" src="js/caman.full.js"></script>
and in my Javascript file (scripts.js) I tried to do the following code snippet:
Caman("#myImage", function () {
this.brightness(5);
}
As the title says, I get the error Caman was used before it was defined. I'm not sure if there's something obvious that I'm missing or doing incorrectly, but any advice would be appreciated.
The Caman script needs to be included first like this:
<script type="text/javascript" src="js/caman.full.js"></script>
<script type="text/javascript" src="scripts.js"></script>
Then in your script you are missing the last );:
Caman("#myImage", function () {
this.brightness(5);
});
If that doesn't work there may be something else in your code that is causing problems.
The following link contains my original question: "getting error in the javascript ,when authenticate the username and password using digest authentication"
By following the suggestions I included the jquery.js file and jquery-1.4.2.min.js files. After that im getting the error as "Uncaught TypeError: Object function (a,b){return new c.fn.init(a,b)} has no method 'Class' ". Can anyone help me to solve this. Thanks in advance...
You need to include the file located in this github repository to define the Class function.
https://github.com/Arrowgroup/JSDigestAuth/blob/master/src/main/webapp/resources/js/jquery.class.min.js
In fact looking at the example there, you will need all this in your header, if you don't have these script files in this order then you will get undeclared errors as you have seen in BOTH your questions.
As an aside, a quick glance at this code shown it to be... well... let's just say "not so good." As an example maybe it can be helpful but I saw many things which were not leading practices.
<script type="text/javascript" src="jquery.min.js" ></script>
<script type="text/javascript" src="jquery.class.min.js" ></script>
<script type="text/javascript" src="md5-min.js" ></script>
<script type="text/javascript" src="digest-auth.js" ></script>
<script type="text/javascript">
var digestAuth = new pl.arrowgroup.DigestAuthentication(
{
onSuccess : function(response){
$("#response").html(response);
},
onFailure : function(response){
$("#response").html('Invalid credentials !!!');
},
cnonce : 'testCnonce'
}
);
function callREST(){
digestAuth.setCredentials($('#user').val(),$('#password').val());
digestAuth.call('/restauth/user/echo');
}
</script>