nextjs template
1.0.0
该模板演示了开发人员如何使用以下技术和库在Telegram Mini Apps平台上实现Web应用程序：
使用PNPM创建模板。因此，也需要将其用于此项目。使用其他软件包经理，您将收到相应的错误。
如果您刚刚克隆了此模板，则应使用命令安装项目依赖项：
pnpm install该项目包含以下脚本：
dev在开发模式下运行应用程序。dev:https 。使用自签名的SSL证书以开发模式运行应用程序。build 。构建生产应用程序。start 。在生产模式下启动下一服务。JS服务器。lint 。运行ESLINT以确保代码质量符合所需的标准。要运行脚本，请使用pnpm run命令：
pnpm run {script}
# Example: pnpm run build 在开始之前，请确保您已经创建了电报机器人。这是有关如何做的综合指南。
尽管迷你应用程序设计为在电报应用程序中打开，但在开发过程中，您仍然可以在电报之外开发和测试它们。
要在开发模式下运行应用程序，请使用dev脚本：
pnpm run dev之后，您将在终端中看到类似的消息：
▲ Next.js 14.2.3
- Local: http://localhost:3000
✓ Starting...
✓ Ready in 2.9s要查看应用程序，您需要在浏览器中打开Local链接（在此示例中http://localhost:3000 ）。
重要的是要注意，此模板中的某些库，例如@telegram-apps/sdk ，不打算在电报之外使用。
然而，它们似乎正常运行。这是因为在应用程序的Root组件中导入的src/hooks/useTelegramMock.ts文件采用了mockTelegramEnv函数来模拟Telegram环境。此技巧使应用程序在基于电报的环境中运行。因此，除非您完全理解其含义，否则不要在生产模式中使用此功能。
尽管可以在电报之外运行应用程序，但建议在电报中开发它，以最准确地表示其现实世界功能。
要在电报中运行应用程序，@botfather需要HTTPS链接。
该模板已经提供了一个解决方案。
要检索使用HTTPS协议的链接，请考虑使用dev:https脚本：
$ pnpm run dev:https
▲ Next.js 14.2.3
- Local: https://localhost:3000
✓ Starting...
✓ Ready in 2.4s在浏览器中访问Local链接（ https://localhost:3000 ），您将看到以下警告：
此浏览器警告是正常的，只要站点安全，就可以安全地忽略。单击Proceed to localhost (unsafe)按钮继续并查看应用程序。
正确显示该应用程序后，提交链接https://127.0.0.1:3000 https://localhost:3000被Botfather视为无效）为@BotFather的迷你APP链接。然后，导航到https://web.telegram.org/k/，找到您的机器人，然后启动Telegram Mini应用程序。这种方法提供了完整的发展经验。
部署您的next.js应用的最简单方法是使用Next.js的创建者的Vercel平台。
请查看下一个。JS部署文档以获取更多详细信息。
