我正在尝试通过非常简单的设置将第三方 SDK 导入到一个简单的项目中。我有一个如下所示的 index.html 文件:
<!DOCTYPE html>
<html lang="en-us">
<body>
<h1>SDK Test</h1>
<script type="module" src="/js/main.js"></script>
</body>
</html>
我有一个如下所示的 main.js 文件:
import MyAlgoConnect from '/@randlabs/myalgo-connect';
console.log("It Worked!");
我的项目中还有 @randlabs 目录运行在 Apache 服务器上，因此在 Apache 的 htdocs 目录中，它看起来像这样:
但我总是在浏览器控制台中收到错误消息:
Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.
我最初尝试使用<script src="/js/main.js"></script>在index.html文件中，但它返回错误:
Uncaught SyntaxError: Cannot use import statement outside a module (at main.js:3:1)
myalgo-connect 文件夹中有一大堆不同的文件和其他文件夹，因此当我尝试访问本地 apache 服务器 127.0.0.1:8080/@randlabs/myalgo-connect 时在我的浏览器中，它只返回一个显示文件夹内容的 html 文档，这就是为什么我认为我首先遇到错误。
根据 SDK 的文档，我认为我完全遵循其快速入门步骤:https://connect.myalgo.com/docs/getting-started/quickstart
我已经在互联网上搜索了好几天，试图找出为什么我无法让它工作。我还在相关的不和谐服务器上提出了问题，但尚未得到答复。我的网络开发经验非常有限，所以这可能只是我经验不足的问题，但我无法弄清楚我做错了什么。如果有人能对此有所启发，我将非常感激!
最佳答案
我建议设置基本节点处理器，然后将应用程序编译成 js 文件。
https://vuejs.org/guide/quick-start.html
https://reactjs.org/docs/create-a-new-react-app.html
https://nextjs.org/docs/getting-started
我还建议设置 TypeScript，因为它对数据类型和建议有很大帮助。
这是如何使用 Randlabs (React) 的 MyAlgoConnect 的示例:https://github.com/Diatomix/Diatomix-frontend/blob/dff9a531ceac4341a3780c004f2bc2206b255ed4/src/components/Authenticate.tsx#L163
如何将 Algorand 与 Vue.js 结合使用的示例:https://github.com/scholtz/wallet
关于javascript - 无法导入第 3 方 JavaScript 模块，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/74924865/