CODEWITHSUNDEEP
dojothemeslessnpm
okorng
okorng

Reputation: 149

Why is there a javascript failure while trying to "node compile.js" for my custom dijit theme?

I just learned of the ability to use the Node.js tool with "less" to generate a custom Dojo Dijit theme. I downloaded Node, and globally installed less like:

npm install -g less

then updated the variables.less and a couple other widget .less files, then ran the compile command:

node compile.js

from my copy of the "claro" Dijit theme directory. I'm running it from a Windows7 platform. I'm running it from the CMD window, but had previously tried it from my CYGWIN window also. Immediately it failed due to the compile.js' path to the "less" module not being found:

less = require('../../../util/less/lib/less');

so I searched in the newly downloaded node and npm folders and found that when I changed the require call to use this path:

less = require('C:/Users/okorng/AppData/Roaming/npm/node_modules/less');

it got further. It found the "less" module at that location, but then compile.js failed during the call to parse the first file:

new(less.Parser)({
    paths: [path.dirname(fname)],
    optimization: options.optimization,
    filename: fname
}).parse(data, function(err, tree){

After putting in some debug console.log() statements, and then also figuring out how to use node-debug with the Chrome browser to have the script debugged by the Chrome developer tool, I found that the call to the Parser.parse() function is failing with an "undefined" error on the "imports" variable:

parse: function (str, callback, additionalData) {
        var root, error = null, globalVars, modifyVars, preText = "";

        globalVars = (additionalData && additionalData.globalVars) ? Parser.serializeVars(additionalData.globalVars) + '\n' : '';
        modifyVars = (additionalData && additionalData.modifyVars) ? '\n' + Parser.serializeVars(additionalData.modifyVars) : '';

        if (globalVars || (additionalData && additionalData.banner)) {
            preText = ((additionalData && additionalData.banner) ? additionalData.banner : "") + globalVars;
        imports.contentsIgnoredChars[fileInfo.filename] = preText.length;
        }

        str = str.replace(/\r\n/g, '\n');
        // Remove potential UTF Byte Order Mark
        str = preText + str.replace(/^\uFEFF/, '') + modifyVars;
 --->   imports.contents[fileInfo.filename] = str;

The error reported to console is:

C:\Users\okorng\AppData\Roaming\npm\node_modules\less\lib\less\parser\parser.js:112
        imports.contents[fileInfo.filename] = str;
               ^
TypeError: Cannot read property 'contents' of undefined
at Object.Parser.parse (C:\Users\okorng\AppData\Roaming\npm\node_modules\less\lib\less\parser\parser.js:112:20)
at C:\COMPASS\URS\trunk\dev\src\IBM\RAD\webapps\CompassThemesURS\WebContent\themes\html\commonurs\dojo\1.9.1\dijit\themes\jelam\compile.js:43:6
at fs.js:272:14
at Object.oncomplete (fs.js:108:15)

and I see that that "imports" variable is one of the parameters that is in the Parser constructor in the less parser.js file:

var Parser = function Parser(context, imports, fileInfo) {

and when I dump the values of these constructor arguments out, both the "imports" and "fileInfo" are undefined.

This Parser constructor is called from the compile.js file that came with the Dijit claro theme. Is that compile.js file in error? Did I miss something that I was supposed to configure differently prior to running the 'node compile.js' command?

Any help would be greatly appreciated. I've been searching the net for any similar compile errors but so far haven't found anyone explaining the same type of problem. If there's any further information that I can give you, please let me know.

Thanks in advance,

Gregor

Upvotes: 0

Views: 323

Answers (1)

okorng
okorng

Reputation: 149

Found the problem!

After more searching I finally found a couple other reports of the same type of error at:

  https://github.com/phiamo/MopaBootstrapBundle/issues/975 
  https://github.com/gruntjs/grunt-contrib-less/issues/224

which suggested that they were using a "less" module that was too new; that they had to downgrade to version 1.7.5. I found that version and downloaded it from:

  https://www.versioneye.com/nodejs/less/1.7.5

then installed it with help from site:

  https://docs.npmjs.com/cli/install

After it was installed I re-ran the command:

  node compile.js

and it just worked!!!

So - the problem was that the less version (2.3.1) that was installed by default was too new for the compile.js that came with the claro theme. Once I downgraded the less to version 1.7.5 the less parser worked as expected!.

Hope this helps someone.

Upvotes: 1

Related Questions