后端"/>
Heroku部署混乱:Vue.js前端与Flask后端
我目前正在使用涉及Vue.js前端和Flask后端作为REST API的Web应用程序。 它们分别在我的仓库中分为客户端和服务器文件夹。 我希望通过Github部署功能将其部署到Heroku,但遇到一些错误和需要澄清的问题。
所有代码都可以在此Github存储库中找到: https : //github/justintranjt/thrive-test
- 在开发中,我一直在像这样运行应用程序:
在一个终端中运行thriveApp.py 。 在另一个终端中,运行npm运行dev 。 导航到localhost:8080,这是运行Vue.js应用程序的本地服务器。
这是应用程序在Heroku上运行的方式吗? 还是使用npm run build运行Vue应用程序? 在那种情况下,我将不得不使用生成的构建文件夹并将其提供给Flask应用程序,对吗?
另外,我在前端和后端之间的一些链接指定本地工作的localhost:8080和localhost:5000(8080是Vue,5000是Flask)。 但是将其部署到Heroku时会起作用吗?
<b-form> <b-button variant="primary" href="http://localhost:5000/loginPage">Login via CAS</b-button> </b-form>
正如你可以看到这里 ,我有我的Vue公司的应用程序的按钮链接到我的瓶应用路由的登录页面。 在Heroku上运行时,是否需要更改URL中显示localhost:5000的部分?
- 最终,当我当前尝试在Heroku上构建应用程序时,仅将代码的Python部分识别为package.json指定的Vue应用程序中的模块,而Heroku安装的requirements.txt指定的Python插件未安装。
我感觉所有这些问题通常都是相互关联的。 关于Heroku部署的任何其他建议或技巧也将有所帮助,因为我目前对部署非常困惑。
回答如下:这是应用程序在Heroku上运行的方式吗?
没有! npm run dev
在开发模式和热重载中使用vue启动整个开发服务器。 这会产生很多开销,尤其是在文件大小方面。
还是使用npm run build运行Vue应用程序?
的种类。 Vue完全不需要在您的服务器上运行,而是全部在客户端。 npm run build
包并将文件最小化到dist文件夹,您将只剩下html,css和javascript-这是生产环境中需要的所有前端代码-无需部署任何源代码文件。 您需要做的就是从任何服务器提供这些静态文件。 这可以通过烧瓶来完成, 也可以通过任何Apache,nginx等来完成。
但是将其部署到Heroku时会起作用吗?
设置起来非常棘手。 这就是为什么我不将前端和后端部署在同一台(虚拟)服务器上的原因之一。
未安装package.json指定的Vue应用程序中的模块
如果您部署捆绑的前端而不是源代码,那么这将不再是问题。 我仍然建议从其他环境中服务前端。
更多推荐
Heroku部署混乱:Vue.js前端与Flask后端
发布评论