使用Vue-cli创建的项目部署生产模式

Question

n00b问题：我使用webpack创建了vue-cli项目。 在我的Windows机器上运行“npm un dev”，我得到了一个带HMR的前端服务器，依此类推。 现在我想将我的应用程序部署到生产机器 - 在DigitalOcean上的ubuntu。

我必须采取哪些步骤？ 我不太熟悉它应该如何工作的逻辑。 如果我的ubuntu机器将NODE_ENV设置为生产，它将不会安装任何devDependancies，我无法构建任何东西。 所以我想我必须改变它？ 如果是，那么它没有任何意义，因为它是一台生产机器。

我是否必须创建另一个节点/快速服务器来为index.html提供服务？ 难道它不应该以某种方式开箱即用吗？

谢谢 ：）

Answer 1

TL; DR在您的本地计算机上构建，您需要的所有内容都将在./dist/目录中输出，只需将内容复制到生产服务器上的webroot，就可以了。

webpack模板为您处理大部分内容。

您需要采取的步骤：

1. 在本地计算机上运行npm run build
2. 将生成的./dist/目录的内容复制到服务器webroot
3. 而已！

当您运行npm run build ，预配置的构建脚本会将节点环境设置为生产环境，并且仅使用应该生产的内容进行构建，它还会优化代码并删除调试功能。 当涉及到依赖关系时，webpack负责处理并将它们包含在./dist/js/生成的javascript文件中，因此您无需关心复制node_modules/目录。 它还将static目录和src/assets目录中的所有内容复制到./dist/目录以准备发布。 并解析webpack生成的新路径的所有引用。

生产服务器不应该关注构建vue应用程序，在本地计算机上运行build命令以使dev依赖性远离生产服务器。 我建议不要在生产服务器上安装webpack和其他开发工具。 它只是用那里不需要的东西污染服务器。 某些开发工具可能会在生产服务器上产生很多问题。 所以最好的做法是永远不要安装它们。

您可以选择创建自己的使用ftp或rsync的发布脚本，无论您希望将./dist/目录中的所有内容复制到生产服务器webroot。 这可能是bash中的一个脚本，如果在windows上，可以在git bash或类似的东西中运行它。

希望能够解决问题，祝贺你的第一个vue发布！