一种用于前端开发的可视化发布方法及系统技术方案

本发明专利技术涉及一种用于前端开发的可视化发布方法及系统，属于前端开发可视化发布领域，解决了在使用前端构建工具发布工程的过程的配置文件较多、发布效率慢的问题。本发明专利技术通过提供可视化的工程发布配置界面接收用户提交的前端工程配置文件的源路径和前端工程的目标发布目录；根据配置文件调用前端工程发布命令启动发布服务将前端工程发布到用户提交的目标发布目录，并生成前端工程数据；提供可视化的NGINX服务配置界面接收用户提交的前端工程数据源路径和NGINX服务启动参数，调用NGINX服务启动命令将加载前端工程数据的NGINX服务启动；调用浏览器从NGINX服务获取前端工程数据并进行展示。用于将前端工程发布操作可视化，提高开发效率。

【技术实现步骤摘要】
一种用于前端开发的可视化发布方法及系统
本专利技术涉及前端开发可视化发布领域，尤其涉及一种用于前端开发的可视化发布方法及系统。
技术介绍
在工程开发过程中，随着工程工程越来越多，构建工具因其便捷、高效性逐渐成为一个通用的工具，受到越来越多的开发者的青睐。在使用前端构建工具发布工程的过程中，存在诸多问题，比如配置文件较多，发布效率慢，入门门槛较高，给前端开发的发布带来了很多不便。
技术实现思路
本专利技术所要解决的技术问题是针对现有技术的不足，提供一种用于前端开发的可视化发布方法及系统，目的在于将前端工程发布可视化，减少工程配置文件，避免配置文件杂乱问题，降低前端人员对工具技能的门槛，提高开发效率。本专利技术解决上述技术问题的技术方案如下：一种用于前端开发的可视化发布方法，包括以下步骤：S1，提供可视化的工程发布配置界面接收用户提交的前端工程配置文件的源路径和前端工程的目标发布目录；S2，根据用户提交的配置文件的源路径获取配置文件，并根据配置文件调用DOS(磁盘操作系统的缩写，是个人计算机上的一类操作系统)环境下的前端工程发布命令，执行所述前端工程发布命令启动发布服务将前端工程发布到用户提交的目标发布目录，并在目标发布目录生成前端工程数据；S3，提供可视化的NGINX服务(一种网页伺服器)配置界面接收用户提交的前端工程数据源路径和NGINX服务启动参数，根据所述前端工程数据源路径和NGINX服务启动参数调用DOS环境下的NGINX服务启动命令，执行所述NGINX服务启动命令将加载前端工程数据的NGINX服务启动；S4，调用浏览器从已加载前端工程数据的NGINX服务获取前端工程数据并进行展示。本专利技术的有益效果是：通过提供配置界面将前端工程发布操作可视化，利用配置界面统一调用配置文件，与常规发布过程中需要的工程配置文件相比能减少一部分配置文件且能有效避免配置文件杂乱问题，降低前端人员的工具使用技能门槛，提高了开发效率。在上述技术方案的基础上，本专利技术还可以做如下改进：进一步，所述S2中所述前端工程发布命令包括以下命令模式：观察预览模式和上线压缩模式。采用上述进一步方案的有益效果是：前端工程发布提供多种模式，在开发测试过程中能节约等待时间，提高开发效率，在上线过程中能节约对服务器资源的占用。进一步，所述S2中在所述执行前端工程发布命令后，自动保存所述前端工程发布的操作记录到日志文件中；所述S3中在所述启动NGINX服务后，自动保存所述启动NGINX服务的操作记录到所述日志文件中。采用上述进一步方案的有益效果是：采用日志文件记录工程发布和NGINX服务运行过程，方便查找整个发布过程，提高调试效率。进一步，所述S3中所述NGINX服务启动参数包括：NGINX服务启动端口、反向代理主机IP地址和反向代理端口。采用上述进一步方案的有益效果是：提供多种NGINX服务启动参数可自定义配置，能高效的启动多个工程的NGINX服务且不易产生冲突，提高开发人员的效率。进一步，所述S2中所述执行前端工程发布命令前，调用DOS环境下的发布服务关闭命令和NGINX服务关闭命令，执行所述发布服务关闭命令和NGINX服务关闭命令将发布服务和NGINX服务关闭。采用上述进一步方案的有益效果是：解决了多个工程连续发布时的端口冲突问题，使多个工程的发布能够依次顺利进行，发布过程简洁连贯。一种用于前端开发的可视化发布系统，包括以下模块：发布配置模块，用于提供可视化的工程发布配置界面接收用户提交的前端工程配置文件的源路径和前端工程的目标发布目录；工程发布模块，用于根据用户提交的配置文件的源路径获取配置文件，并根据配置文件调用DOS环境下的前端工程发布命令，执行所述前端工程发布命令启动发布服务将前端工程发布到用户提交的目标发布目录，并在目标发布目录生成前端工程数据；NGINX服务模块，提供可视化的NGINX服务配置界面接收用户提交的前端工程数据源路径和NGINX服务启动参数，根据所述前端工程数据源路径和NGINX服务启动参数调用DOS环境下的NGINX服务启动命令，执行所述NGINX服务启动命令将加载前端工程数据的NGINX服务启动；工程展示模块，用于调用浏览器从已加载前端工程数据的NGINX服务获取前端工程数据并进行展示。本专利技术的有益效果是：通过提供配置界面将前端工程发布操作可视化，利用配置界面统一调用配置文件，与常规发布过程中需要的工程配置文件相比能减少一部分配置文件，且能有效避免配置文件杂乱问题，降低前端人员的工具使用技能门槛，提高了开发效率。在上述技术方案的基础上，本专利技术还可以做如下改进：进一步，所述工程发布模块中所述前端工程发布命令包括以下命令模式：观察预览模式和上线压缩模式。采用上述进一步方案的有益效果是：前端工程发布提供多种模式，在开发测试过程中能节约等待时间，提高开发效率，在上线过程中能节约对服务器资源的占用。进一步，所述工程发布模块还用于在执行前端工程发布命令后，自动保存所述前端工程发布的操作记录到日志文件中；所述NGINX服务模块还用于在启动NGINX服务后，自动保存所述启动NGINX服务的操作记录到所述日志文件中。采用上述进一步方案的有益效果是：采用日志文件记录工程发布和NGINX服务运行过程，方便查找整个发布过程，提高调试效率。进一步，所述NGINX服务模块中所述NGINX服务启动参数包括：NGINX服务启动端口、反向代理主机IP地址和反向代理端口。采用上述进一步方案的有益效果是：提供多种NGINX服务启动参数可自定义配置，能高效的启动多个工程的NGINX服务且不易产生冲突，提高开发人员的效率。进一步，所述工程发布模块还用于在执行前端工程发布命令前，调用DOS环境下的发布服务关闭命令和NGINX服务关闭命令，执行所述发布服务关闭命令和NGINX服务关闭命令将发布服务和NGINX服务关闭。采用上述进一步方案的有益效果是：解决了多个工程连续发布时可能产生的端口冲突问题，使多个工程的发布能够依次顺利进行，发布过程简洁连贯。附图说明图1为本专利技术实施例1中一种用于前端开发的可视化发布方法的流程图；图2为本专利技术实施例2中一种用于前端开发的可视化发布系统的结构框图。具体实施方式以下结合附图对本专利技术的原理和特征进行描述，所举实例只用于解释本专利技术，并非用于限定本专利技术的范围。实施例1如图1所示，一种用于前端开发的可视化发布方法，包括以下步骤：S1，提供可视化的工程发布配置界面接收用户提交的前端工程配置文件的源路径和前端工程的目标发布目录；S2，根据用户提交的配置文件的源路径获取配置文件，并根据配置文件调用DOS环境下的前端工程发布命令，执行所述前端工程发布命令启动发布服务将前端工程发布到用户提交的目标发布目录，并在目标发布目录生成前端工程数据；S3，提供可视化的NGINX服务配置界面接收用户提交的前端工程数据源路径和NGINX服务启动参数，根据所述前端工程数据源路径和NGINX服务启动参数调用DOS环境下的NGINX服务启动命令，执行所述NGINX服务启动命令将加载前端工程数据的NGINX服务启动；S4，调用浏览器从已加载前端工程数据的NGINX服务获取前端工程数据并进行展示。具体的，本方法使用可视化的工程发布配置界面提供用户选择待发布的前端工程的配本文档来自技高网...

【技术保护点】
一种用于前端开发的可视化发布方法，其特征在于，包括以下步骤：S1，提供可视化的工程发布配置界面接收用户提交的前端工程配置文件的源路径和前端工程的目标发布目录；S2，根据用户提交的配置文件的源路径获取配置文件，并根据配置文件调用DOS环境下的前端工程发布命令，执行所述前端工程发布命令启动发布服务将前端工程发布到用户提交的目标发布目录，并在目标发布目录生成前端工程数据；S3，提供可视化的NGINX服务配置界面接收用户提交的前端工程数据源路径和NGINX服务启动参数，根据所述前端工程数据源路径和NGINX服务启动参数调用DOS环境下的NGINX服务启动命令，执行所述NGINX服务启动命令将加载前端工程数据的NGINX服务启动；S4，调用浏览器从已加载前端工程数据的NGINX服务获取前端工程数据并进行展示。

【技术特征摘要】
1.一种用于前端开发的可视化发布方法，其特征在于，包括以下步骤：S1，提供可视化的工程发布配置界面接收用户提交的前端工程配置文件的源路径和前端工程的目标发布目录；S2，根据用户提交的配置文件的源路径获取配置文件，并根据配置文件调用DOS环境下的前端工程发布命令，执行所述前端工程发布命令启动发布服务将前端工程发布到用户提交的目标发布目录，并在目标发布目录生成前端工程数据；S3，提供可视化的NGINX服务配置界面接收用户提交的前端工程数据源路径和NGINX服务启动参数，根据所述前端工程数据源路径和NGINX服务启动参数调用DOS环境下的NGINX服务启动命令，执行所述NGINX服务启动命令将加载前端工程数据的NGINX服务启动；S4，调用浏览器从已加载前端工程数据的NGINX服务获取前端工程数据并进行展示。2.根据权利要求1所述的用于前端开发的可视化发布方法，其特征在于，所述S2中所述前端工程发布命令包括以下命令模式：观察预览模式和上线压缩模式。3.根据权利要求2所述的用于前端开发的可视化发布方法，其特征在于，所述S2中在所述执行前端工程发布命令后，自动保存所述前端工程发布的操作记录到日志文件中；所述S3中在所述启动NGINX服务后，自动保存所述启动NGINX服务的操作记录到所述日志文件中。4.根据权利要求3所述的用于前端开发的可视化发布方法，其特征在于，所述S3中所述NGINX服务启动参数包括：NGINX服务启动端口、反向代理主机IP地址和反向代理端口。5.根据权利要求1至4任一项所述的用于前端开发的可视化发布方法，其特征在于，所述S2中所述执行前端工程发布命令前，调用DOS环境下的发布服务关闭命令和NGINX服务关闭命令，执行所述发布服务关闭命令和NGINX服务关闭命令将发布服务和NGINX服务关闭。6.一种用于前端开发的可视化发布系统，其特征在于，包...

【专利技术属性】
技术研发人员：申江波，
申请(专利权)人：北京思特奇信息技术股份有限公司，
类型：发明
国别省市：北京,11