Trouble with hosting template files using Flask [duplicate]
This question already has an answer here:
How to serve static files in Flask
13 answers
Link to Flask static files with url_for
2 answers
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)
javascript python html css flask
marked as duplicate by davidism flask
Users with the flask badge can single-handedly close flask questions as duplicates and reopen them as needed.
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 23 '18 at 14:42
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
add a comment |
This question already has an answer here:
How to serve static files in Flask
13 answers
Link to Flask static files with url_for
2 answers
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)
javascript python html css flask
marked as duplicate by davidism flask
Users with the flask badge can single-handedly close flask questions as duplicates and reopen them as needed.
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 23 '18 at 14:42
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
3
In development, use the static folder, in production use your webserver.
– Klaus D.
Nov 23 '18 at 2:39
add a comment |
This question already has an answer here:
How to serve static files in Flask
13 answers
Link to Flask static files with url_for
2 answers
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)
javascript python html css flask
This question already has an answer here:
How to serve static files in Flask
13 answers
Link to Flask static files with url_for
2 answers
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)
This question already has an answer here:
How to serve static files in Flask
13 answers
Link to Flask static files with url_for
2 answers
javascript python html css flask
javascript python html css flask
asked Nov 23 '18 at 2:21
user10649535
marked as duplicate by davidism flask
Users with the flask badge can single-handedly close flask questions as duplicates and reopen them as needed.
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 23 '18 at 14:42
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
marked as duplicate by davidism flask
Users with the flask badge can single-handedly close flask questions as duplicates and reopen them as needed.
StackExchange.ready(function() {
if (StackExchange.options.isMobile) return;
$('.dupe-hammer-message-hover:not(.hover-bound)').each(function() {
var $hover = $(this).addClass('hover-bound'),
$msg = $hover.siblings('.dupe-hammer-message');
$hover.hover(
function() {
$hover.showInfoMessage('', {
messageElement: $msg.clone().show(),
transient: false,
position: { my: 'bottom left', at: 'top center', offsetTop: -7 },
dismissable: false,
relativeToBody: true
});
},
function() {
StackExchange.helpers.removeMessages();
}
);
});
});
Nov 23 '18 at 14:42
This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.
3
In development, use the static folder, in production use your webserver.
– Klaus D.
Nov 23 '18 at 2:39
add a comment |
3
In development, use the static folder, in production use your webserver.
– Klaus D.
Nov 23 '18 at 2:39
3
3
In development, use the static folder, in production use your webserver.
– Klaus D.
Nov 23 '18 at 2:39
In development, use the static folder, in production use your webserver.
– Klaus D.
Nov 23 '18 at 2:39
add a comment |
1 Answer
1
active
oldest
votes
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') }}">
answered Nov 23 '18 at 5:49
illusionillusion
13618
add a comment |
1 Answer
1
active
oldest
votes
1 Answer
1
active
oldest
votes
active
oldest
votes
active
oldest
votes
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') }}">
answered Nov 23 '18 at 5:49
illusionillusion
13618
add a comment |
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') }}">
answered Nov 23 '18 at 5:49
illusionillusion
13618
add a comment |
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') }}">
answered Nov 23 '18 at 5:49
illusionillusion
13618
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') }}">
answered Nov 23 '18 at 5:49
illusionillusion
13618
answered Nov 23 '18 at 5:49
illusionillusion
13618
answered Nov 23 '18 at 5:49
illusionillusion
13618
answered Nov 23 '18 at 5:49
illusionillusion
13618
13618
add a comment |
add a comment |
3
In development, use the static folder, in production use your webserver.
– Klaus D.
Nov 23 '18 at 2:39