less-plugin-autoprefix icon indicating copy to clipboard operation
less-plugin-autoprefix copied to clipboard

Browser usage is not supported at this time

Open roelvanduijnhoven opened this issue 8 years ago • 5 comments

My current situation does need this functionality. The LESS files are compiled on the client, and we use modifyVars after a settings is changed by the user.

Do you hava an idea how this library could theortically be extended for this to work? I would be willing to contribute.

As less.modifyVars does not return the result, but adapts the DOM, it is not easy to chain an autoprefix after it. A solution could be to look at the latest introduced <style> tag and autoprefix it. Howver that feels really hacky.

roelvanduijnhoven avatar Dec 28 '15 14:12 roelvanduijnhoven

plugins are supported browserside, all you'd need to do is package this plugin and auto prefixer (say using browserify) into a file and set a window.less.plugins before less.js is loaded.

lukeapage avatar Dec 28 '15 14:12 lukeapage

Thanks for the input.

I bundled using:

browserify --standalone AutoprefixProcessor main.js -o bundle.js

And then registered as:

less.plugins = [
    new window.AutoprefixProcessor({
        browsers: ['> 0.5% in NL', 'last 3 versions', 'Firefox ESR']
    })
];

But gives no input.

Most likely related to version 1.7.2 of Less I am running. First need to upgrade that.

roelvanduijnhoven avatar Dec 28 '15 15:12 roelvanduijnhoven

yes, it needs a v2..

lukeapage avatar Dec 28 '15 15:12 lukeapage

Thanks for helping out. So we upgraded from the 1.7.2 release (which was long due ;))!

Using the dutch set does not work. It fails

Uncaught (in promise) Error: Cannot find module 'caniuse-db/region-usage-json/NL'

Even though I explicitly required it in my main.js file and the set seems to be present in the bundle:

var usage = require('caniuse-db/region-usage-json/NL');
module.exports = require('./lib/index.js');

The JS file that I build this way has a minimized file size of 1.2MB :fearful:

roelvanduijnhoven avatar Dec 30 '15 11:12 roelvanduijnhoven

There is a clean solution for this now. That is using postcss using the less syntax. That we I can generate a autoprefixed LESS file that I serve to the front-end.

You +1 on closing this one @lukeapage?

roelvanduijnhoven avatar May 12 '16 13:05 roelvanduijnhoven