一种针对多开发项目的全球广域网前端的开发系统和方法技术方案

技术编号:30231853 阅读:25 留言:0更新日期:2021-09-29 10:06
本发明专利技术提供一种针对多开发项目的全球广域网前端的开发系统和方法,公用模块对全球广域网前端的开发项目常用的工具包进行管理,将常用的工具包统一压缩成一个文件进行存储;储存模块存储有预先建立的前端开发模板,前端开发模板适用于多个开发项目;创建模块分别连接公用模块和储存模块,用于调用公用模块管理的工具包,并克隆前端开发模板,创建新的开发项目。架构清晰,简单易用,公用模块统一管理工具包,使得node_modules统一入口,极大减少硬盘占用空间,开发项目创建模块由统一模版创建生成,方便灵活,相互独立,复用性强。复用性强。复用性强。

【技术实现步骤摘要】
一种针对多开发项目的全球广域网前端的开发系统和方法


[0001]本专利技术涉及web前端
,尤其涉及一种针对多开发项目的全球广域网前端的开发系统和方法。

技术介绍

[0002]前端开发是创建Web页面或app等前端界面呈现给用户的过程,通过HTML,CSS及JavaScript以及衍生出来的各种技术、框架、解决方案,来实现互联网产品的用户界面交互。它从网页制作演变而来,名称上有很明显的时代特征。在互联网的演化进程中,网页制作是Web1.0时代的产物,早期网站主要内容都是静态,以图片和文字为主,用户使用网站的行为也以浏览为主。随着互联网技术的发展和HTML5、CSS3的应用,现代网页更加美观,交互效果显著,功能更加强大。
[0003]随着网页页面中包含的信息越来越丰富,使得用于构建网页页面的前端脚本(JavaScript)程序也越来越复杂。目前,为了提升对前端JavaScript程序的开发效率,一般采用模块化的的开发方式以降低编辑的复杂度,例如,基于Node.js和模块标准编辑前端JavaScript程序。现有web前端开发项目开发其缺点如下:(1)每个开发项目会生成大量node_modules,累加占用硬盘空间;(2)开发项目模版不统一,复用性差;(3)缺乏统一的工具库,维护成本高且造成请求资源浪费。

技术实现思路

[0004]基于现有技术中存在的技术问题,本专利技术提供一种针对多开发项目的全球广域网前端的开发系统和方法,旨在解决现有技术中硬盘空间占有量大等技术问题。
[0005]一种针对多开发项目的全球广域网前端的开发系统,其特征在于:
[0006]公用模块,用于对全球广域网前端的开发开发项目常用的工具包进行管理,将常用的分散的所述工具包统一文件聚合成一个文件以及将所述文件进行压缩;
[0007]储存模块,存储有预先建立的前端开发模板,前端开发模板适用于多个开发开发项目;
[0008]创建模块,分别连接公用模块和储存模块,用于调用公用模块管理的工具包,并克隆前端开发模板,创建新的开发项目。
[0009]进一步的,开发系统还包括启动模块,连接创建模块,用于根对新创建的开发项目进行运行,并利用第三方打包工具对新创建的开发项目进行跨域和热更新处理。
[0010]进一步的,开发系统还包括打包模块,连接启动模块,用于对新创建的开发项目进行生产环境配置,删除新创建的开发项目中的冗余代码后进行打包。
[0011]进一步的,开发系统还包括升级模块,连接公用模块,用于对常用的工具包进行统一升级。
[0012]进一步的,常用的工具包括日期函数和请求函数。
[0013]进一步的,所述创建模块包括:
[0014]信息配置单元,用于在创建新的所述开发项目过程中,进行开发项目信息配置;
[0015]目录创建单元,用于在创建新的所述开发项目过程中,创建主目录、创建子目录。
[0016]进一步的,创建模块基于Linux指令克隆前端开发模板。
[0017]进一步的,步骤S1,预先建立的前端开发模板存储于储存模块中,前端开发模板适用于多个开发开发项目;
[0018]步骤S2,公用模块对全球广域网前端的开发开发项目常用的工具包进行管理,将常用的工具包统一压缩成一个文件进行存储;
[0019]步骤S3,创建模块调用公用模块管理的工具包,并克隆前端开发模板,创建新的开发项目。
[0020]本专利技术的有益技术效果是:本专利技术提供一种针对多开发项目的全球广域网前端的开发系统和方法,架构清晰,简单易用,公用模块统一管理工具包,使得node_modules统一入口,极大减少硬盘占用空间,开发项目创建模块由统一模版创建生成,方便灵活,相互独立,复用性强。
附图说明
[0021]图1为一种针对多开发项目的全球广域网前端的开发系统的模块示意图;
[0022]图2为一种针对多开发项目的全球广域网前端的开发系统的模块示意图;
[0023]图3为一种针对多开发项目的全球广域网前端的开发方法的步骤流程图。
具体实施方式
[0024]下面将结合本专利技术实施例中的附图,对本专利技术实施例中的技术方案进行清楚、完整地描述,显然,所描述的实施例仅仅是本专利技术一部分实施例,而不是全部的实施例。基于本专利技术中的实施例,本领域普通技术人员在没有作出创造性劳动的前提下所获得的所有其他实施例,都属于本专利技术保护的范围。
[0025]需要说明的是,在不冲突的情况下,本专利技术中的实施例及实施例中的特征可以相互组合。
[0026]下面结合附图和具体实施例对本专利技术作进一步说明,但不作为本专利技术的限定。
[0027]参见图1

2,本专利技术提供一种针对多开发项目的全球广域网前端的开发系统,其特征在于:
[0028]公用模块(1),用于对全球广域网前端的开发开发项目常用的工具包进行管理,将常用的工具包统一压缩成一个文件进行存储;具体的,将常用的分散的所述工具包统一文件聚合成一个文件以及将所述文件进行压缩;
[0029]储存模块(2),存储有预先建立的前端开发模板,前端开发模板适用于多个开发开发项目;
[0030]创建模块(3),分别连接公用模块(1)和储存模块(2),用于调用公用模块(1)管理的工具包,并克隆前端开发模板,创建新的开发项目。
[0031]具体的,公用模块(1)集中管理web开发项目中常见的js工具包,比如日期函数,请求函数的工具包,把工具包压缩为一个js文件。
[0032]具体的,公用模块(1)根据需求自定义配置,采用linux脚本语言设计,使用到
touch,cat等指令将分散的文件聚合成一个文件,使用uglyfyjs指令完成压缩功能。
[0033]具体的,创建模块(2)是指初始化生成新开发项目的模块,主要作用是快速克隆前端开发模板生成新的开发项目。
[0034]具体的,创建模块(2)采用linux脚本语言和Nodejs程序语言设计,Nodejs全局变量process.argv[3]获取到开发项目名称变量为${a},创建${a}目录,Linux脚本execSync指令触发克隆文件流程到${a},从而实现一键克隆前端开发模板,达到快速创建开发项目的目的。
[0035]进一步的,开发系统还包括启动模块(4),连接创建模块(3),用于对新创建的开发项目进行运行,并利用第三方打包工具对新创建的开发项目进行跨域和热更新处理。
[0036]具体的,启动模块(4)管理本地环境开发。
[0037]具体的,启动模块(4)主要采用了第三方打包工具webpack的相关技术,配置webpackproxy中间件解决了服务端与客户端域名不一致造成的跨域问题,配置webpack devServer对象hot属性值,开启本地开发热更新,解决了开发中手动刷新浏览器的困扰。
[0038]进一步的,开发系统还包括打包模块(5),连接启动模块(5),用本文档来自技高网
...

【技术保护点】

【技术特征摘要】
1.一种针对多开发项目的全球广域网前端的开发系统,其特征在于:公用模块(1),用于对全球广域网前端的开发项目常用的工具包进行管理,将常用的分散的所述工具包统一文件聚合成一个文件以及将所述文件进行压缩;储存模块(2),存储有预先建立的前端开发模板,所述前端开发模板适用于多个开发项目;创建模块(3),分别连接所述公用模块(1)和所述储存模块(2),用于调用所述公用模块(1)管理的所述工具包,并克隆所述前端开发模板,创建新的所述开发项目。2.如权利要求1所述的一种针对多开发项目的全球广域网前端的开发系统,其特征在于:所述开发系统还包括启动模块(4),连接所述创建模块(3),用于对新创建的所述开发项目进行运行,并利用第三方打包工具对新创建的所述开发项目进行跨域和热更新处理。3.如权利要求1所述的一种针对多开发项目的全球广域网前端的开发系统,其特征在于:所述开发系统还包括打包模块(5),连接所述启动模块(5),用于对新创建的所述开发项目进行生产环境配置,删除新创建的所述开发项目中的冗余代码后进行打包。4.如权利要求1所述的一种针对多开发项目的全球广域网前端的开发系统,其特征在于:所述开发系统还包括...

【专利技术属性】
技术研发人员:梁玉森胡茂华
申请(专利权)人:壹药网科技上海股份有限公司
类型:发明
国别省市:

网友询问留言 已有0条评论
  • 还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。

1