I use doT.js 1.0 for templating with requirejs.
My goal is to load a file called "length.html" from another file called "freight.html".
The advanced sample states that you can load files with
{{#def.loadfile('/snippet.txt')}}
So I tried using {{#def.loadfile('/length.html')}} in freight.html.
freight.html is in the same directory as length.html.
However, the javascript console throws an error:
Uncaught TypeError: Object #<Object> has no method 'loadfile'
How can I get loadfile to work? Or is the documentation wrong and there is no loadfile function?
It appears as though loadfile needs to be created by you, as per your requirements. If you are using express, I would suggest looking at https://github.com/nerdo/dot-emc. This module wraps doT so that you can use res.render() to return your templates. It also provides a nifty include function to solve the problem you have above. So instead of loadfile you would use:
{{#def.include('length')}}
Just be aware that if you use this module, the default file extension is .def, which needs to be changed with options to use say .html
Related
I use Angular with vanillajs libraries. There is no problem. Library works fine, but most of the time, I have to do the following
declare var MyLib: any;
However, for this particular library (CanvasJS), this works...
import * as CanvasJS from '../../assets/canvasjs/canvasjs.min.js';
What's different, and most importantly how does the library allow import function directly?
The difference is inside the JS library that you are importing.
In this repository I've added a showcase using canvasJs, underscoreJs and Jquery. I hope everithing it's explained in the comments HERE.
Only the latter (jquery) has the need to be defined as a "script" inside the angular.json file ( or inside the index.html file, it's the same ) because it's not defined as an exportable object but it's a factory which adds the variable $ to the global context when executed.
So in this case, you don't need to IMPORT it, you just have to "declare" the already present variable in the context to not have TypeScript errors!
As a bonus, the correct way to use JQuery inside an angular project is to install jquery #types, you can find it in this branch.
I would like to use this library (https://github.com/riichard/boolean-parser-js) (which is really just a function?) in my own project.
My project is contained in a single html file. In one of the functions, I've tried including the following:
var parser = require('boolean-parser');
I get the following error when I include this.
Uncaught ReferenceError: require is not defined
I have installed the library via the terminal, using "npm install boolean-parser". At the same level as my project, I see a file called "node_modules", which contains "boolean-parser".
I'm not sure if this is the right method of referring to the library...
I'm also not sure how to find out what it.
If possible, please explain terminology in your answer(s)-- I have limited background knowledge in this area, as this is essentially my first real web project!
Happy to include code upon request. Feel free to suggest tag additions!
P.S. Could it be a file path problem? Do I need to use something like Browserify?
P.P.S. If I include
<script src="node_modules/boolean-parser/index.js"></script>
then it seems like the library is working, but then I get an error from within it:
index.js:295 Uncaught ReferenceError: module is not defined
at index.js:295
It is because you are making client side project. Here is related question link
Listen, i created simple html page with 2 script tags. First contains src="index.js" which is in the same folder and edited as i said before. Second script tags is:
<script>
console.log(window.module):
</script>
And everything works. Check yourself again.
I'm using Mapbox, and I'm trying to convert a Geojson to a zipped shapefile using shp-write. But when I follow the example given on the GitHub page, I'm getting a "ReferenceError: require is not defined" error on this line:
var shpwrite = require('shp-write');
This is a jsfiddle in which you can test this. I'm relatively new to JavaScript, and haven't had to use the 'require()' function before.
The jsfiddle you provided includes several external resources, among which a shpwrite delivered by unpkg that you may be missing.
Usually require doesn't exist in your browser. You would need to execute it with Node.js or use a module bundler like Webpack, but Unpkg takes care of it for you.
So adding:
<script src="https://unpkg.com/shp-write#latest/shpwrite.js"></script>
on your page should make it work.
I'm trying to develop a custom xtype that extends the tags xtype defined in
/libs/cq/tagging/widgets/source/widgets/TagInputField.js
I have the function defined in another file
CQ.tagging.customTagInputField = CQ.Ext.extend(CQ.TagInputField, { /*A whole bunch of code here */ });
CQ.Ext.reg("customtags", CQ.tagging.customTagInputField);
Yet every time I try to boot up a page containing my custom widget I get an error in my console saying
TypeError: sp is undefined
spp = sp.prototype;
According to the all wise and knowing Google. This kind of error usually means I'm trying to extend something that doesn't exist. However changing
CQ.Ext.extend(CQ.TagInputField,
to something a bit more specific like
CQ.Ext.extend(CQ.tagging.TagInputField,
Produces and error saying CQ.tagging is undefined. Is there a way for me to extend this file in CQ5? If so what am I doing wrong?
Within /libs/cq/tagging/widgets/source/widgets/TagInputField.js, you'll see that the tags widget is declared as CQ.tagging.TagInputField, so I believe your second approach of extending that field is correct.
You mentioned that your custom xtype is in a separate file - when your page loads and your extension code is invoked, has the tagging widgets library loaded? You may need to add the tagging category to your custom client lib as a dependency.
On custom JS clientlibs and dependencies:
http://helpx.adobe.com/cq/kb/HowToCreateCustomClientLib.html
I have several files (header.html, nav.html, footer.html). I was wondering if there's a way to include these files into index.html while the page loads (or before) using plain js or jquery library. I know it's better to do it from server-side, but right now I'm working on front-end and don't have access to server-side scripts.
When I try to use $.load('header.html'), it gives me the following error:
Uncaught TypeError: Object function (a,b){return new e.fn.init(a,b,h)} has no method 'load'
The load() function has to be called on a matched element.
$('#myDiv').load('test.html');
In this example, the content will be loaded to the myDiv element.