0

I want to host 3 files that are in /Project/templates in app.py using the Flask framework. Here is what it looks like.

Project
├── templates
│   ├── index.html
│   ├── index.js
|   └── style.css
├── app.py

How do I host these files in app.py using the Flask framework? Here is my attempt at it, but it is giving me a blank page.

from flask import Flask, render_template

app = Flask(__name__)

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

@app.route('/index.js')
def index_js():
    return render_template('index.js')

@app.route('/style.css')
def style_css():
    return render_template('style.css')

if __name__ == '__main__':
    app.run(debug=True)
  • 3
    In development, use [the static folder](http://flask.pocoo.org/docs/1.0/tutorial/static/), in production use your webserver. – Klaus D. Nov 23 '18 at 02:39

1 Answers1

0

I believe that index.js and style.css are static files. So to access them, create a folder static in the same directory as templates. So the structure looks like this

Project
├── templates
│   └── index.html
├── static
│   ├── index.js
│   └── style.css
└── app.py

and then in the templates, for example, index.html, include them by

<script type="text/javascript" src="{{ url_for('static', filename='index.js') }}"></script>
<link rel="stylesheet" type="text/css" href="{{ url_for('static', filename='style.css') }}">
illusion
  • 1,272
  • 11
  • 22