Less.js: Импорт удаленных URL-адресов нарушен с v3.0.1
С less v2.7.3 (используя webpack v3.1.0 и less-loader v4.1.0) я мог импортировать удаленные шрифты, как это, в мой файл main.less:
<strong i="6">@import</strong> url('https://fonts.googleapis.com/css?family=Nunito');
С меньшим количеством v3.0.1, использующим ту же конфигурацию и зависимости, теперь я получаю эту ошибку только при попытке сборки:
Message:
./node_modules/css-loader??ref--1-2!./node_modules/postcss-loader/lib??ref--1-3!./node_modules/less-loader/dist/cjs.js??ref--1-4!./src/css/main.less
Module build failed:
*/
<strong i="10">@import</strong> url('https://fonts.googleapis.com/css?family=Nunito');
^
Can't resolve './https://fonts.googleapis.com/css?family=Nunito' in 'C:\Projekte\mine\homepage\src\css'
in C:\Projekte\mine\homepage\src\css\main.less (line 6, column 0)
rejas
Все 6 Комментарий
Я думаю, это может быть связано с тем, что Less больше не переключается автоматически на импорт "css" (с сохранением оператора @import ) только потому, что он находит строку "css" где-то в URL-адресе.
Попробуйте <strong i="7">@import</strong> (css) url('https://fonts.googleapis.com/css?family=Nunito');
matthew-dean
20 мар. 2018
Замечательный @ matthew-dean, который действительно помог. Большое спасибо!
rejas
20 мар. 2018
@ matthew-dean Есть ли способ указать компилятору использовать https по умолчанию при разрешении URL-адресов из импорта? например, когда я использую <strong i="5">@import</strong> url(//fonts.googleapis.com/css?family=Open+Sans:400,700); , вывод будет
@font-face {
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans Regular'), local('OpenSans-Regular'), url(http://fonts.gstatic.com/s/opensans/v17/mem8YaGs126MiZpBA-UFVZ0e.ttf) format('truetype');
}
Когда я помещаю это на страницу, загружаемую через HTTPS, я получаю сообщение об ошибке «смешанное содержимое», а HTTP-запросы блокируются браузером. Итак, теперь мне нужно обновить весь импорт, чтобы использовать (css) или https://... , так что просто интересно, могу ли я сделать это с помощью параметра конфигурации?
dmitriy-drenkalyuk
30 окт. 2019
так что просто интересно, могу ли я сделать это с помощью параметра конфигурации?
Нет. Более того, сама идея импорта fonts.googleapis.com в скомпилированный CSS опасна, потому что fonts.googleapis.com обнюхивает используемый браузер (очевидно, Less в node будет сообщать о себе как Chrome / Chromium ) и может возвращать разные результаты в зависимости от этого (пока я не слышал о каких-либо проблемах в этом отношении, но он может сломаться в любой момент).
seven-phases-max
30 окт. 2019
@ dmitriy-drenkalyuk Почему бы просто не написать:
<strong i="6">@import</strong> url(https://fonts.googleapis.com/css?family=Open+Sans:400,700);
?
matthew-dean
30 окт. 2019
@ matthew-dean Это то, что я в конечном итоге сделал, просто искал возможность сделать это через конфигурацию, чтобы нам не нужно было искать и обновлять все места, где мы используем такой импорт.
dmitriy-drenkalyuk
22 нояб. 2019
Смежные вопросы
matthew-dean
·
6Комментарии
briandipalma
·
6Комментарии
BrianMulhall
·
4Комментарии
renoth
·
6Комментарии
pknepper
·
3Комментарии
Самый полезный комментарий
Я думаю, это может быть связано с тем, что Less больше не переключается автоматически на импорт "css" (с сохранением оператора
@import) только потому, что он находит строку "css" где-то в URL-адресе.Попробуйте
<strong i="7">@import</strong> (css) url('https://fonts.googleapis.com/css?family=Nunito');