+1

Issues compiling .less file locally on iPad

Jeff Szpak 8 years ago in iPad updated 8 years ago 9

What did you try? Textastic doesn't include a less compiler, but less.js should work.

+1

Weird, it looks like my comment didn't post. Sorry about that. I'm using less-1.3.3.min.js to try to compile locally. It's working fine in remote view, but I can't seem to get it to work locally. The directory set up is the same on my server, so I think everything should be set up properly, but I can't get it working for some reason. 


I'm loving Textastic by the way. Never thought I'd enjoy coding on the iPad, but you have made it quite fun. 

Please have a look at the discussion in this topic: http://feedback.textasticapp.com/topic/80258-i-have-been-trying-to-use-textastic-with-less-lesscssorg-and-i-have-been-unable-to-get-it-to-preview-the-html-file-correctly/


There you will find an example of how to to use less.css.


Another user there reported a problem with Twitter's Bootstrap, but there is a workaround.


I'll give that a shot tonight and let you know how it goes. Thanks for the help. 

No luck unfortunately. If it helps at all, I'll include a link to my working files. Everything works as expected in remote view and viewing in Safari, Chrome, etc. with the .less file and less.js. Thanks again for looking into this. 


http://jszpak.com/snip/dev/

I've downloaded your files locally to my Mac. When I try to use it locally in Safari (with the file:// protocol), it doesn't work either.


The same file does work in Firefox though, but not in Chrome and Safari.


The current version of Less seems to use XMLHttpRequest, which doesn't work with the file:// protocol - at least in WebKit.


So, this seems to be a bug in Less.

Here's the code where it fails to load the file:

function xhr(url, type, callback, errback) {

    var xhr = getXMLHttpRequest();

    var async = isFileProtocol ? less.fileAsync : less.async;

    if (typeof(xhr.overrideMimeType) === 'function') {

        xhr.overrideMimeType('text/css');

    }

    xhr.open('GET', url, async);

    xhr.setRequestHeader('Accept', type || 'text/x-less, text/css; q=0.9, */*; q=0.5');

    xhr.send(null);

It fails at "xhr.send(null);" in line 4261 when executed from a file:// url in Safari.

The problem is described here, too: http://stackoverflow.com/questions/3084892/less-js-not-working-in-chrome


It seems to be a security measure in WebKit so that web pages can't load arbitrary local files using XMLHttpRequest.

Ahh, that's unfortunate. Thank you for looking into the issue. You're help has been greatly appreciated.