Вопрос по pug, node.js – Как включить файл CSS в Jade (без ссылки на него)
У меня есть этот нефритовый файл:
!!! 5
html
head
title test include
style(type='text/css')
//- DOES NOT WORK!
include test.css
body
//- works
include test.css
div
//- works
include test.css
Выход
$ jade -P test.jade
rendered test.html
$ cat test.html
<!DOCTYPE html>
<html>
<head>
<title>test include</title>
<style type="text/css">
//- DOES NOT WORK!
include test.css
</style>
</head>
<body>body { color: peachpuff; }
<div> body { color: peachpuff; }
</div>
</body>
</html>
Конечно, я могу просто связать css-файл, но я не хочу.
Я предполагаю, что вы хотите отделить CSS от HTML в файлах сервера, но предоставить стиль в html, чтобы избежать дополнительного запроса на получение CSS. Это неправильно: вы добавляете дополнительные вычисления (включение файла) для файла, который не будет запрашиваться каждый раз, потому что он будет кэшироваться.
Arnaud Rinquin
Не думаю, что это возможно, но почему бы не простое решение?
jsbeckr
6
ответов
но есть шанс, что что-то подобное может сработать:
!!!
head
title test include
| <style type='text/css'>
include test.css
| </style>
Кстати, я нашел онлайн-конвертер HTML2Jade, но не Jade2HTML. Есть идеи, где его найти?
Я проверил, и это работает.
Webthusiast
Спасибо, надеюсь, user470370 пометит его как ответивший;)
Arnaud Rinquin
спасибо, работает! Я не знаю ни одного онлайн-конвертера. но сначала я нашел причину сбоя: «Теги, которые принимают только текст, такой как сценарий и стиль, не нуждаются в начальном | символе» Github.com / visionmedia / нефрит)
user470370
doctype html
html
head
style
include style.css
body
h1 My Site
p Welcome to my super lame site.
Это отлично работает.
Пока это работает, я хочу добавить, что он равен коду в исходном вопросе, разница в версии (прошло 3 года).
pzy
Проходятfs в качестве данных, и вы можете
style !{fs.readFileSync("index.css").toString()}
не совсем подходит для кросс-реализации, но, тем не менее, хороший взлом
CoolAJ86
этого было бы достаточно, чтобы написать просто include style.css.
Полный пример (учитывая, что вы пишете index.jade, который находится вviews папка, а ваши стили вassets папка):
!!!
html
head
include ../assets/bootstrap3/css/bootstrap-theme.css
include ../assets/bootstrap3/css/bootstrap.css
body
h1 Hi!
Обратите внимание, отсутствиеstyle те в шаблоне, он будет вставлен автоматически с помощью Jade (какая замечательная особенность!).
Возможное решение будет:
style(type="text/css")
#{css}
А затем передайте css-текст вres.render(...) вызов
Это ... это просто решение его проблемы, которого я совсем не понимаю. ;)
jsbeckr
Я нахожу это очень и очень грязным: ты связываешь функционал и данные со стилем ...
Arnaud Rinquin
Смотри мой комментарий о своей цели;)
Arnaud Rinquin
Похожие вопросы
Я предполагаю, что вы хотите отделить CSS от HTML в файлах сервера, но предоставить стиль в html, чтобы избежать дополнительного запроса на получение CSS. Это неправильно: вы добавляете дополнительные вычисления (включение файла) для файла, который не будет запрашиваться каждый раз, потому что он будет кэшироваться.
Не думаю, что это возможно, но почему бы не простое решение?