1 javascript python flask webpack html-webpack-plugin
我目前正在创建一个涉及flask和webpack的项目。当前,flask服务器能够找到启示模板,但是无法找到相关的JavaScript。
我有一个使用webpack html插件创建HTML文件的webpack配置,如下所示:
const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CleanWebpackPlugin = require('clean-webpack-plugin');
module.exports = {
entry: {app: './src/index.js', print: './src/print.js'},
output: {filename: '[name].bundle.js', path: path.resolve(__dirname, 'dist')},
plugins: [new HtmlWebpackPlugin({template:"./src/index.html"}), new CleanWebpackPlugin(['dist'])],
};
Run Code Online (Sandbox Code Playgroud)
这将在src目录中使用名为index.html的模板,其中包含以下内容:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Hellow World</title>
</head>
<body>
<h1>It Works</h1>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
webpack应该将其与以下javascript index.js捆绑在一起:
import _ from 'lodash';
import printMe from './print.js';
function component() {
let element = document.createElement('div');
let btn = document.createElement('button');
// lodash now imported
element.innerHTML = _.join(['Hello', 'webpack'], ' ');
// new button
btn.innerHTML = 'Click me and check the console!';
btn.onclick = printMe;
element.appendChild(btn);
return element;
}
document.body.appendChild(component());
Run Code Online (Sandbox Code Playgroud)
和print.js:
export default function printMe() {
console.log('I get called from print.js!');
}
Run Code Online (Sandbox Code Playgroud)
app.py如下所示:
from flask import Flask, render_template
app = Flask(__name__, template_folder="dist/", static_folder="dist/")
@app.route("/")
def index():
"""
renders basic index page
:return: template
"""
return render_template("index.html")
# app entry point
if __name__ == "__main__":
app.run(debug=True)
Run Code Online (Sandbox Code Playgroud)
运行构建后,将在dist文件夹中生成一个模板,其中index.html中包含以下内容:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Hellow World</title>
</head>
<body>
<h1>It Works</h1>
<script type="text/javascript" src="app.bundle.js"></script><script type="text/javascript" src="print.bundle.js"></script></body>
</html>
Run Code Online (Sandbox Code Playgroud)
我无法锻炼它如何能够找到模板,但无法找到相关的JavaScript。
根据app.bundle.js您的配置的正确URL 是/dist/app.bundle.js
如果要从其他文件夹提供静态文件,则必须设置static_url_path参数,在这种情况下为"":
app = Flask(__name__, template_folder="dist", static_folder="dist", static_url_path="")
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
1127 次 |
| 最近记录: |