Какие есть живые и универсальные (IE, Edge) полифиллы для работы CSS-переменных?

Question

[Vadim Rublev]

Посоветуйте проверенный универсальный полифилл для применения CSS-переменых в IE и Edge, плиз.
А то первый попавшийся взял... - не работает. (( Другой смотрю - только для IE11...

Comments

[Froggyweb]

В Edge переменные работают
для ie сам нашел решение. Или тебе надо ie6?

[Vadim Rublev]

Надо для IE11.
Какое решение?

...Сейчас только заметил коммент.

Answer 1

[Владимир Солнцев]

https://github.com/jhildenbiddle/css-vars-ponyfill пробовали? Но, как по мне, вариант с использованием sass\less\stylus лучше.

Comments

[Vadim Rublev]

Вот его как раз и пробовал. Не смог подключить. Хотел локально заюзать. На Гитхабе указан вариант подключения только через сеть.
(По крайней мере у меня не заработало с тем подключением, как я пытался сделать.)
Я впервые такое делаю. До этого подключал только jQuery - ну там один файл, просто.

[Владимир Солнцев]

Vadim Rublev, вы пользуетесь локальным сервером или просто файл открываете браузером?
Там CORS нарушается, когда скрипт пытается спарсить файл со стилями. Через локальный сервер с нормальными заголовками должно работать, а если просто файлом, то нужно писать css в html файле и убрать все все link[stylesheet]
Если не понятно объяснил, напишите, я вам скриншотами попробую объяснить.

[Vadim Rublev]

Конечно сервер локальный. По-взрослому. )

[Vadim Rublev]

> Через локальный сервер с нормальными заголовками должно работать,
Ну, я скачал папку себе в директорию /domen.com/js/css-vars-ponyfill/ , там ещё папка dist, и в ней сами файлы. (domen.com - это public_html, где открываемая HTML-страница лежит.)
В HTML подключил:

<script src="js/css-vars-ponyfill/dist/css-vars-ponyfill.js"></script>

(из всех файлов решил этот выбрать).
И ничего (в Edge тестил).

[Владимир Солнцев]

Vadim Rublev,

Посмотрите, что в консольке пишет тогда.

[Vadim Rublev]

> Посмотрите, что в консольке пишет тогда.
Ничего не пишет. У меня кастомный сервер. ) Таким премудростям не обучен.

Я подключаю локально, а вы по сети.
Вопрос - локально заюзать (в смысле - работать с полифиллом, который на своём сервере лежит).

[Vadim Rublev]

Тут ещё играет роль правильность подключения. Не факт, что я правильно подключил, ведь такого подключения официально не указано. И вообще, может быть, подключать это на местном сервере нельзя.
Поэтому я и спросил про другие полифиллы.

[Владимир Солнцев]

Vadim Rublev,
Перейти: https://cdn.jsdelivr.net/npm/css-vars-ponyfill@2
Скопировать код
Создать файл
Вставить код
Подключить в html

Ну или воспользоваться npm)

[Владимир Солнцев]

Посмотрите внимательно скрины выше, сравните со своим вариантом подключения. Я же не могу знать, что вы делаете не так. А сама библиотека работает)

[Vadim Rublev]

Создал файл cssVar.js. Открыл вашу ссылку и скопировал оттуда весь код в этот файл. Подключил файл, примерно как у вас (и в корень положил, и в подпапку js, подключал туда и туда).
В Edge не сработало. (В ослике не могу сейчас потестить, там чот у меня ещё ДО этого не работает.)

[Vadim Rublev]

Вижу, что пакет работает. У вас. )
Но почему у вас пакет превратился в один файл - я не вкурил. У автора же кучка файлов, и скачивается папкой.
И прикол с подключаемым странным файлом css-vars-ponyfill@2 я тоже не понял. (

[Владимир Солнцев]

Vadim Rublev, кусочками, потому что на гитхаб обычно выкладывают исходники, необработанный код в чистом виде и инструкцию по сборке \ установке. Автор этого предлагает два варианта: установить с npm или ссылкой с cdn.
Вот ссылка на css-vars-ponyfill@2 это второй вариант. Там лежит собранный и сжатый автором пакета код этого же пакета. Можно просто вставить в html ссылку или скопировать на свой комп и подключить локально, если очень нужно. Все, никакой магии и приколов.

Я не умею гадать по аватарке, поэтому не могу подсказать почему плагин у вас не работает. Но сам плагин вполне рабочий.

[Vadim Rublev]

Специально сделал тест в IE11 - не работает.

[Vadim Rublev]

> не могу подсказать почему плагин у вас не работает.
Это ясно. Про это вопроса нет.

[Vadim Rublev]

> Все, никакой магии и приколов.
Теперь понятно.

Так подумаешь - действительно легче Less юзать. Там разобраться самому можно, хотя бы.

[Владимир Солнцев]

Vadim Rublev, работает и в ослике 11 и его старшем брате - эдже, точно-точно. На счет less, мне этот вариант тоже нравится больше - пользователям не придется грузить кучу лишнего кода)
Но на самом деле там нет ничего сложного, если потратить время и вникнуть. Все плагины\пакеты подключаются примерно одинаково, научитесь с одним, справитесь с другими.
Если собираетесь заниматься разработкой, вам придется вникнуть, это самые самые основы - как компютер включать\выключать для бабушки.

https://jhildenbiddle.github.io/css-vars-ponyfill/...
Вот примерно везде так же, как и тут.

[Vadim Rublev]

А я малость недопонял принцип работы этого полифилла...
Он переписывает CSS-код, превращая его в старый-понятный формат - как видно в примере у автора. А как? Он загружается на клиент, определяет старый браузер, открывает все подключенные CSS-файлы (как-то их вычисляя на месте), и открывает-редактирует-закрывает-сохраняет их? Или как?

[Vadim Rublev]

> Но на самом деле там нет ничего сложного, если потратить время и вникнуть. Все плагины\пакеты подключаются примерно одинаково, научитесь с одним, справитесь с другими.
> Если собираетесь заниматься разработкой, вам придется вникнуть...
Когда придётся - буду вникать.
Сейчас я прошёл мимо. Ибо по факту эта штука у меня не заработала (хотя я сделал всё как вы сказали). И её использование не критично. Поэтому заюзаю сейчас Less, с которым я уже немного знаком.