无法使用flask-assets从sass文件生成all.css文件 [英] Cant generate all.css file from sass files with flask-assets

问题描述

我对在烧瓶应用程序中使用CSS感到厌倦，因此我决定转而使用烧瓶资源 https://github.com/miracle2k/flask-assets .我将此添加到了我的app.py文件中:

I became tired of using css in my flask app so I decided to move to scss with flask assets https://github.com/miracle2k/flask-assets. I added this in my app.py file:

from flask_assets import Environment, Bundle

assets = Environment(app)
assets.debug = True
assets.url = app.static_url_path
scss = Bundle('sass/foo.scss', 'sass/bar.scss', filters='pyscss', output='gen/all.css')
assets.register('scss_all', scss)

如果我理解正确，这些行应该去检查我的static/sass文件夹并生成一个具有单个all.css缩小文件的gen文件夹，对吗?我还在静态资产文件夹中创建了一个sass文件夹，并在其中创建了foo.scss文件，并使用一些代码对其进行了测试.但是，当我启动该应用程序时，什么也没有生成，并且没有任何错误.我在这里做什么错了?

If I understand correctly, these lines are supposed to go check my static/sass folder and generate a gen folder with a single all.css minified file right ? I also created a sass folder inside my static assets folder and foo.scss file inside it with some code to test it out. However when I launch the app, nothing is generated and I get no error. What am I doing wrong here ?

推荐答案

这就是我的工作方式.

这是我的项目目录在生成任何内容之前的屏幕截图:

Here is a screen shot of my project directory before it generates anything:

接下来，我确保已安装以下组件:

Next, I made sure I had the following installed:

pip安装flask-assets

pip install flask-assets

pip install pyscss(这是您在filter ='pyscss'部分中的过滤器)

pip install pyscss (this is your filter in the filters='pyscss' section)

这是我设置代码的方式:

Here is how I have the code setup:

from flask import Flask, render_template
from flask_assets import Environment, Bundle

app = Flask(__name__)

assets = Environment(app)
assets.url = app.static_url_path
assets.debug = True

scss = Bundle('sass/foo.scss', 'sass/bar.scss', filters='pyscss', output='gen/all.css')
assets.register('scss_all', scss)


@app.route('/')
def hello_world():
    return render_template('index.html')


if __name__ == '__main__':
    app.run()

还有index.html:

And the index.html:

{% assets "scss_all" %}
    <link rel="stylesheet" href="/static/gen/all.css">
{% endassets %}
<ul>
    <li>
        Test Flask Assets
    </li>
</ul>

现在，当我运行该应用程序时，它花了几秒钟的时间生成了CSS，但是确实生成了.完成后，下面是运行后的目录结构:

Now, when I ran the application it took a sec for it to generate the css, but it did generate. Once it does, here is the directory structure after running:

您可以在chrome调试器中看到它确实已加载:

And you can see in the chrome debugger that it indeed does load:

请务必注意，该文件夹必须在配置 output ='gen/all.css'中配置为 gen ，否则它将无法正常工作.

It's important to note that the folder has to be gen in the configuration output='gen/all.css' otherwise it won't work.

编辑同样，按照@David的评论，很重要的一点是，必须创建所有必需的scss文件才能生成输出.

EDIT Also per @David's comment, it's important that you have all the required scss files created to generate the output.

这篇关于无法使用flask-assets从sass文件生成all.css文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！