Как правильно настроить Flask + pypugjs + sass?
Я разрабатываю какое-то приложение с Flask, и теперь я решил упростить весь процесс с помощью pypugjs (это python port of jade template engine для JS) и SASS. Установить и использовать pypugjs легко и плавно, но сейчас я не знаю, как правильно использовать его с SASS.
Я читал эту тему, она предоставляет решение Flask + SASS через Flask-Assets и pyscss. И это работает без pypugjs
довольно хорошо, но с pypugjs
Я не могу использовать {% assets %}
тег.
Поэтому я просто решил позвонить assets.build()
в колбу часть. Но это выглядит как своего рода трансректальное решение:
from flask import Flask
from flask import render_template
from flask_assets import Environment, Bundle
import pypugjs
app = Flask(__name__)
app.jinja_env.add_extension('pypugjs.ext.jinja.PyPugJSExtension')
assets = Environment(app)
assets.url = app.static_url_path
assets.debug = True
scss = Bundle('sass/foo.scss', filters='pyscss', output='all.css')
assets.register('scss_all', scss)
@app.route('/')
def hello_world():
assets['scss_all'].build()
return render_template('flask_hello.pug', test_fl="EMPEROR", test='false')
Я пытался настроить Flask-Scss (он также использует pyscss
для компиляции SASS) в качестве промежуточного программного обеспечения. Но проект выглядит довольно мертвым (последний коммит был в 2015 году), и мне не удалось заставить его автоматически компилировать файлы SASS для меня.
Затем я попытался создать собственный фильтр для pypugjs, используя libsass (потому что это самое свежее и живое репозиторий на github со страницы https://github.com/sass/libsass-python). Это работает, если я использую его как встроенную вставку:
style
:sass_it
$primary-color: gold;
body { background-color: $primary-color;}
И pypugjs даже имеет возможность импортировать файлы через фильтры, такие какinclude:my_filter filepath
Колба предотвращает такие включения статических файлов. Конструкции как link(rel='stylesheet', href='static/bar.css'):filter
тоже не работают.
Я попытался использовать libsass в качестве отдельной функции в бэкэнде:
from flask import Flask
from flask import render_template
# import pypugjs
import sass
app = Flask(__name__)
app.jinja_env.add_extension('pypugjs.ext.jinja.PyPugJSExtension')
@app.route('/')
def hello_world():
sass.compile(dirname=('sass', 'css'), output_style='compressed')
return render_template('flask_hello.pug', test_fl="EMPEROR", test='false')
Но он не менее трансректален, чем подход Flask-Assets выше, и даже больше - он не объединяет несколько файлов в один.
И последнее, что я попробовал, был libsass с SassMiddleware. Он работает, но работает только для отдельных файлов, он не объединяет все мои файлы scss в один, несмотря на это site-packages/sassutils/builder.py
имеетbuild_directory()
а также build()
функции, он использует только build_one()
,
Ниже я приведу подробный пример, как наиболее актуальный.
Часть колбы:
from flask import Flask
from flask import render_template
from sassutils.wsgi import SassMiddleware
app = Flask(__name__)
app.jinja_env.add_extension('pypugjs.ext.jinja.PyPugJSExtension')
app.wsgi_app = SassMiddleware(app.wsgi_app, {
'pypugtests': {'sass_path': 'static/sass',
'css_path': 'static/css',
'strip_extension': True,
},
})
@app.route('/')
def hello_world():
return render_template('flask_hello.pug', test_fl="EMPEROR", test='false')
if __name__ == '__main__':
app.run()
часть pypugjs:
!!! 5
html(lang="en")
head
title= pageTitle
// scss generated
link(rel='stylesheet', href='static/css/foo.css')
link(rel='stylesheet', href='static/css/bar.css')
body
h1.title PugJS - node template engine
#container
if (test == 'false')
p You are amazing, #{test_fl}
else
p Get on it!
Структура Dir:
pypugtests/
├── __init__.py
├── pypugtests.py
├── static
│ ├── css
│ │ ├── bar.css
│ │ ├── bar.css.map
│ │ ├── foo.css
│ │ └── foo.css.map
│ └── sass
│ ├── bar.scss
│ └── foo.scss
└── templates
└── flask_hello.pug
Файлы в каталоге css создаются автоматически.
Итак, есть ли способ автоматически скомпилировать все файлы scss из каталога sass в один файл css? Или я делаю все неправильно и хочу странных вещей, и вместо этого я должен использовать '@import'?
PS: нет pypugjs
тег, и у меня нет репутации, чтобы создать его, поэтому я буду использовать старое имя проекта - pyjade
в списке тегов.