问题描述
一点背景。 我一直在关注本教程： : 并且已经暂时对标题中的问题进行故障排除。
代码编译并运行服务器，但是在查找 bundle.js 时出现 404 错误。
我的文件夹结构是：
.
├── web-app
├── configurations.py
├── __init__.py
├── README.md
├── run.py
└── templates
├── hello
│ ├── __init__.py
│ └── views.py
├── __init__.py
├── public
│ ├── css
│ ├── fonts
│ ├── images
│ └── js
└── static
├── index.html
├── __init__.py
├── js
├── components
├── index.jsx
└── routes.js
我的 webpack.config.js 是：
var path = require('path')
const webpack = require('webpack');
const resolve = require('path').resolve;
const config = {
devtool: 'eval-source-map',
entry: __dirname + '/js/index.jsx',
output:{
path: path.join(__dirname, '/dist'),
filename: 'bundle.js'
},
resolve: {
extensions: ['.js','.jsx','.css']
},
module: {
rules: [
{
test: /\.jsx?/,
loader: 'babel-loader',
exclude: /node_modules/,
query: {
presets: ['react', 'es2015']
}
},
{
test: /\.css$/,
loader: 'style-loader!css-loader?modules'
}]
}
};
module.exports = config;
最后，我的 index.js 是：
<!— index.html —>
<html>
<head>
<meta charset="utf-8">
<!-- Latest compiled and minified bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">
<link rel="stylesheet" href="public/css/main.css">
<title>Creating a Full-Stack Python Application with Flask, NPM, React.js and Webpack</title>
</head>
<body>
<div id="content" />
<script src="public/bundle.js" type="text/javascript"></script>
</body>
</html>
我运行“npm run watch”并收到 404 错误，因为它无法找到 bundle.js。 它查找的 url 路径是 。
我相信我已经设置了 Flask 在我的 web-app/templates/ init .py 文件中寻找正确的路径，如下所示：
from flask import Flask
app = Flask(__name__,
static_folder = './public',
template_folder="./static")
from templates.hello.views import hello_blueprint
# register the blueprints
app.register_blueprint(hello_blueprint)
我知道这是很多代码，但经过大量的研究和故障排除后，我仍然保持原样。 任何帮助或指导将不胜感激。
谢谢！
1楼
helloitsjoe
1
已采纳
2019-02-25 04:00:36
在您的 index.html 中， script的src指向public/bundle.js ，但您的 webpack 配置的输出是(dir containing webpack config)/dist/bundle.js 。
您的文件夹结构没有显示 webpack 配置的位置，但您要确保配置的输出和 html script的src属性指向相同的路径。
2楼
R. Anstotz
0
2020-03-19 03:25:53
一年后更新。 我很快就想通了，并使用 Webpack 和 Heroku 创建了一个 Flask/React 样板。 这真的不是广告，但这里是 repo，以防有人遇到类似问题：