Question

我一直在尝试在Flask应用程序中执行外部JS库-特别是this one。我遵循的步骤是：

导航到static并执行npm init。我填写了提示等等。
npm install --save json-formatter-js。我可以看到它在PyCharm中可见。
在<body>中，我有

<script type="text/javascript" src="{{ url_for('static', filename='node_modules/json-formatter-js/dist/json-formatter.js') }}"></script>

我也尝试过将其放置在其他目录中。
我要执行的脚本与库的README中的脚本几乎相同。我在static/js/main.js中有它。

import JSONFormatter from 'json-formatter-js';

const test = {ans: 42};
const formatter = new JSONFormatter(test);
document.body.appendChild(formatter.render());

<body>也有<script type="text/javascript" src="{{ url_for('static', filename='js/main.js') }}"></script>包含上述脚本。
PyCharm提示我安装该库，如下所示：

提示中的npm install和Install json-formatter-js选项都不起作用-下划线保持不变。正当如此，尝试执行main.js会导致错误：

import JSONFormatter from 'json-formatter-js';
       ^^^^^^^^^^^^^

SyntaxError: Unexpected identifier
    at Module._compile (internal/modules/cjs/loader.js:721:23)

以此类推。

我很想听听任何建议或建议阅读-我从SO和其他地方尝试了一些建议，上述步骤几乎是解决问题的准系统方法。

一起使用Flask和npm库

0 个答案: