Flask-assets provides a convenient way to add the following frameworks to your Flask application:
- Bootstrap 5.3.3
- htmx 2.0.4
- Font Awesome 6.7.2
- Tom-Select 2.4.1
poetry add git+ssh://git@https://github.com/garzola/flask-assets.git
The following is a very basic example of referencing the assets in this package. url_for() is also available in Jinja templates and used the same way.
from flask import Flask, url_for
from flask_assets import flask_assets_blueprint
app = Flask(__name__)
app.register_blueprint(flask_assets_blueprint)
@app.route("/")
def hello_world():
htmx = url_for("flask-assets.htmx", asset="htmx.min.js")
fontawesome_css1 = url_for("flask-assets.fontawesome", asset="css/all.min.css")
fontawesome_css2 = url_for("flask-assets.fontawesome", asset="css/solid.css")
bootstrap_css = url_for("flask-assets.bootstrap", asset="css/bootstrap.min.css")
bootstrap_js = url_for("flask-assets.bootstrap", asset="js/bootstrap.bundle.min.js")
tom_select_js = url_for("flask-assets.tom-select", asset="tom-select.complete.js")
return f"""
<!doctype html>
<html lang="en">
<head>
<title> Test Page </title>
<script src="{htmx}"></script>
<link href="{fontawesome_css1}", rel="stylesheet" />
<link href="{fontawesome_css2}", rel="stylesheet" />
<link href="{bootstrap_css}" rel="stylesheet" />
<script src="{bootstrap_js}"></script>
</head>
<body class="container-fluid">
<h1> Test Page </h1>
<p>This page has htmx, bootstrap, and fontawesome loaded</p>
</body>
</html>
"""The code snippet is not located within the flask-assets package. You can find this code in the root of the github repo under the name testsrv.py
You can find information about htmx at https://htmx.org
url_for("flask-assets.htmx", asset="htmx.min.js")You can find information about fontawesome at https://fontawesome.com
url_for("flask-assets.fontawesome", asset="css/all.min.css")
url_for("flask-assets.fontawesome", asset="css/solid.css")You can find information about bootstrap at getbootstrap.com
url_for("flask-assets.bootstrap", asset="css/bootstrap.min.css")
url_for("flask-assets.bootstrap", asset="js/bootstrap.bundle.min.js")You can find information about tom-select.js at tom-select.js.org
url_for("flask-assets.tom-select", asset="tom-select.complete.js")