时间戳

首页 > 解决方案 > Flask：如何使用 ES6 模块？

javascript - Flask：如何使用 ES6 模块？

问题描述

我有一个正在工作的 Flask 应用程序，我正在尝试重构它以使用 ES6 导入。我不需要它在旧浏览器上运行，并且 ES6 导入在现代浏览器中工作而无需转译，对吗？

我现在只是通过 Flask 的内置服务器运行它。生产应用程序是通过 gevent 提供的，但我显然还没有进行这些更改。

以下是我到目前为止所尝试的。我哪里出错了？

视图.py

@app.route('/home')
def serve_home():
    return render_template('home.html')

格式化.js

export function formatNumber(...) {
  ...
}

尝试 1

主页.html

<script type="text/javascript" src="/static/js/main.js"></script>

main.js

import {formatNumber} from "/static/js/formatting.js";

错误（main.js，第 1 行）

Uncaught SyntaxError: Unexpected token {

尝试 2

主页.html

<script type="module" src="/static/js/main.js"></script>

错误（main.js，第 1 行）

加载模块脚本失败：服务器以“text/plain”的非 JavaScript MIME 类型响应。根据 HTML 规范对模块脚本强制执行严格的 MIME 类型检查。

尝试 3

主页.html

<script type="module" src="/static/js/main.mjs"></script>

主要的.mjs

import {formatNumber} from "/static/js/formatting.mjs";

错误（main.mjs，第 1 行）

加载模块脚本失败：服务器以“application/octet-stream”的非 JavaScript MIME 类型响应。根据 HTML 规范对模块脚本强制执行严格的 MIME 类型检查。

标签： javascriptpythonflaskes6-modules

解决方案

对于那些遇到错误的人：

The server responded with a non-JavaScript MIME type [...]

...您需要确认 python 正在返回您的 JS 文件的预期 mimetype。

>>> import mimetypes
>>> mimetypes.guess_type("notExists.js")
('text/javascript', None)

对于我自己，使用 Windows 平台从（例如 Flask 的开发服务器）托管 Web 服务器，我发现我需要更新注册表以将文件扩展名与text/javascript.

例如，在注册表编辑器中：

  1. 在 HKEY_CLASSES_ROOT 下，找到.js（.mjs如果使用它）
  2. 查看“内容类型”的值。它必须说text/javascript, NOT text/plain, or application/octet-stream, 等等。

推荐阅读