DncZeus前后端分离项目打包/发布/部署及注意事项

前言

DncZeus这个基于ASP.NET Core + Vue.js前后端分离的通用后台管理框架从发布到现在已有大半年时间了，期间很多使用者问到DncZeus项目怎么打包，怎么发布，怎么部署等等类似的问题。之前也未在DncZeus的文档中提及关于打包，发布和部署的相关资料，今天就以DncZeus为例为大家介绍：

• DncZeus前端项目如何打包及注意事项？
• DncZeus后端项目如何发布及注意事项？

DncZeus前端项目(DncZeus.App)打包

首先，我们要知道，DncZeus的前端项目是基于Vue.js实现，运行和打包都依赖于webpack(至于什么是webpack本文不作介绍，请自行查阅资料)。

如果要在本地运行DncZeus前端项目，我们得进入前端项目(DncZeus.App)的根目录，然后运行命令：

那么，如果要将DncZeus前端项目打包成可以部署到服务器的Web网站项目，我们得在前端项目(DncZeus.App)的根目录，运行如下命令：

此命令会在当前的前端项目的根目录中创建一个命名dist的文件夹，并将打包好的所有前端项目的静态文件放入其中，静态文件包含：.html,.css,.js以及所有前端项目可能所涉及的图片文件等等。

简而言之，npm run build命令打包生成的前端项目dist文件夹其实就是一个静态Web网站，你可以将这个Web网站部署到任何服务器环境，包括但不限于:IIS,Apache,Tomcat,Nginx等。

前端项目打包注意事项

在打包前端项目之前，你可能需要注意以下几个方面：

vue.config.js

请仔细核对vue全局配置文件vue.config.js中的配置，并将其中的选项值修改成你自己环境所需要的值，其中像这样的判断：process.env.NODE_ENV === 'production'表示生产环境，也就是需要发布到外部服务器的环境，举例如下：

以上这条语句表示：

如果你运行npm run dev命令，那么process.env.NODE_ENV的值为：dev，即本地开发环境
如果你运行npm run build命令，那么process.env.NODE_ENV的值为：production，即生产环境

请注意修改BASE_URL在不同环境中对应的值，说明如下：

config/index.js

前端项目配置文件位于：/config/index.js中，此文件中你可以配置前端项目的全局参数，如：title,’cookieExpires’,’useI18n’,’baseUrl’,’homeName’等等，详情请打开对应文件查看，有详细的注释文档。

其中需要特别注意的是:baseUrl和authUrl这两个属性，其中的dev表示开发环境，pro表示生产环境。

特别是pro对应的值，请一定修改成你实际的后端项目的路径，否则当你部署到生产环境后，API请求将失败，因为你的生产环境的API地址不正确。比如，如果我后端API项目的地址是：https://api.dnczeus.com/，那么baseUrl和authUrl的配置分别为：

DncZeus后端项目(DncZeus.Api)发布及注意事项

打包和发布

DncZeus后端项目(DncZeus.Api)是一个ASP.NET Core 2的项目，本地开发数据库为mssqllocaldb。

至于ASP.NET Core项目的发布，你可以使用Visual Studio 2019的发布功能，也可以使用dotnet命令行发布，这里不作具体的说明。

由于ASP.NET Core 是支持跨平台的，所以发布后的DncZeus后端项目可以部署到Windows,Linux等等操作系统。

后端项目注意事项

后端项目需要注意的是跨域的问题，默认是AllowAnyOrigin()，这是一种不安全的行为，请根据你的实际情况指定域，特别是在.NET Core 2.2+中，已不再支持AllowAnyOrigin()方法，请用WithOrigins()指定具体的域。