来自 <url> 的脚本已加载，即使其 MIME 类型（“text/html”）不是有效的 JavaScript MIME 类型答案

【问题标题】：The script from <url> was loaded even though its MIME type (“text/html”) is not a valid JavaScript MIME type来自 <url> 的脚本已加载，即使其 MIME 类型（“text/html”）不是有效的 JavaScript MIME 类型
【发布时间】：2020-06-20 05:39:27
【问题描述】：

我有一个 Flask 后端，我的 webpack 配置看起来像这样（去掉了 sass/css/babel）。

const webpack = require('webpack');
const resolve = require('path').resolve;
const HtmlWebpackPlugin = require('html-webpack-plugin');
const isDevelopment = process.env.NODE_ENV === 'development';

const config = {
    entry: {
        main: __dirname + '/js/index.jsx'
    },
    devtool: 'eval-source-map',
    output:{
        path: resolve('../public'),
        filename: '[name].[chunkhash].js'
    },
    resolve: {
        extensions: ['.js','.jsx','.scss']
    },
     ...etc ...etc ...etc

    plugins: [
        new HtmlWebpackPlugin({
            hash: true,
            inject: false,
            hash: true,
            template: './index.html',
            filename: 'index.html'
        })
    ]
};

module.exports = config;

当我执行 webpack-cli 命令 webpack --progress -d --config webpack.config.js --watch 时，index.html 会在 ../public 中正确创建，[name].[chunkhash].js 也是如此。示例：

<!DOCTYPE html>
<html>
    <head>
    </head>
    <body>
        <div id="app" />
        <script src="main.6e9f93766744ff757148.js?58e0a4a8c99dee0bfe93"></script>
    </body>
</html>

在 Flask 中，我指定：

app = Flask(__name__,
 template_folder="./templates/public")

所以当你点击localhost:<port>时，它应该渲染application/templates/public/index.html（我在application/templates/src做开发，然后执行webpack命令，输出被放入application/templates/public）。

现在，当我玩flask run时，网络中出现以下输出：

127.0.0.1 - - [07/Mar/2020 19:40:53] "GET / HTTP/1.1" 200 -
127.0.0.1 - - [07/Mar/2020 19:40:53] "GET /main.6e9f93766744ff757148.js?58e0a4a8c99dee0bfe93 HTTP/1.1" 404 -

在开发者工具中，我可以在响应中看到正确的 html 和对 javascript 的引用。

但控制台状态：

The script from <url>/<file>.js was loaded even though its MIME type (“text/html”) is not a valid JavaScript MIME type.

所以 Flask 正在呈现正确的 html 文件，但找不到 javascript。我怎样才能让 Flask 找到这个 javascript？

谢谢！

【问题讨论】：

有一个包可以帮助解决这个问题 - github.com/nickjj/flask-static-digest

标签： javascript reactjs flask npm webpack

【解决方案1】：

原来这是 Flask 的问题，而不是 webpack 或其他任何东西。我已将我的 static_folder 指定为 static/dist，而它本应设置为 static。

【讨论】：