从HTML引用JS时出现意外的语法错误意外字符串？

Question

好的，我从Github下载了此文件，试图在本地运行/修改它。 https://tympanus.net/Tutorials/InteractiveRepulsionEffect/interactive-repulsive-effect.zip

主要index.html使用以下命令调用JS：<script type="text/javascript" src="app.0ffbaba978f8a0c5e2d0.js"></script>，这似乎是我要修改的app.js的缩小版本。

文件结构如下：

我将html更改为：<script type="text/javascript" src="../src/scripts/app.js"></script>，这是构成场景的JS的正确文件路径，但随后我得到了

  

未捕获的SyntaxError：意外的字符串

在app.js的第1行上，

import 'styles/index.scss';
import Cone from './elements/cone';
import Box from './elements/box';
import Tourus from './elements/tourus';

我尝试更改此路径，没关系。它只是不“喜欢”这条线。这里发生了什么？如何引用可编辑的JS文件？

Answer 1

不能。您拥有的JavaScript代码尚未准备好在浏览器中运行。

这些public/app.xxxxxxxxxx.js文件可以在浏览器中运行，并且很可能由Webpack编译（或类似的文件）。您的存储库中已有某种“构建”过程-您可以查看scripts的{​​{1}}部分以查看可用的构建命令。

Answer 2

确实，您必须将自己放置在first-demo文件夹中并修改您的应用程序js。然后运行

npm install

安装webpack和所有缺少的软件包（仅一次）。然后您可以运行

npm run build

，它将使用您的更改重建您的公用文件夹。更好的是，您可以

npm run start

，并且在

中修改app.js时，您会看到更改的最新更新。

http://localhost:9000