一种多页面资源文件注入方法及装置制造方法及图纸

本发明专利技术公开了一种多页面资源文件注入方法，该方法包括以下步骤：在建设目标网站过程中，获得页面参数配置信息，页面参数配置信息为在设定环境条件下配置完成的；根据页面参数配置信息，确定环境模式，并生成环境模式对应的Webpack配置文件；建立Webpack配置文件涉及的各个资源文件与页面文件的关联关系；根据关联关系，将各个资源文件分别注入到相关联的页面文件中。应用本发明专利技术实施例所提供的技术方案，提高了产品开发效率，减少了技术输出和技术成本。本发明专利技术还公开了一种多页面资源文件注入装置，具有相应技术效果。

Multi page resource file injection method and device

The invention discloses a multi page document resource injection method, the method includes the following steps: in the construction of the target site in the process of obtaining the page parameter configuration information page parameter configuration information to complete the configuration in the setting of environmental conditions; according to the page parameter configuration information, determine the environment model, the Webpack configuration file and generate the corresponding environmental model the relationship between the establishment of various resources; file and page file configuration file to Webpack; according to relationship, each resource file was injected into the associated page in the document. With the technical proposal provided by the embodiment of the invention, the efficiency of product development is improved, and the technical output and technical cost are reduced. The invention also discloses a multi page resource file injection device, which has corresponding technical effects.

【技术实现步骤摘要】
一种多页面资源文件注入方法及装置
本专利技术涉及网络应用
，特别是涉及一种多页面资源文件注入方法及装置。
技术介绍
在网站产品开发过程中，多会利用单页面应用技术或多页面应用技术对页面进行配置。单页面应用是指网站中只存在一个HTML页面，多页面应用是指网站中存在多个HTML页面，一个页面对应于一个资源文件。目前，在网站产品开发过程中，多是通过技术人员手动将资源文件写入到页面中。这种方法存在一定缺点，因为手动写入容易出错，尤其是在多页面应用中，这将使得产品开发效率较低，技术输出和技术成本较高。
技术实现思路
本专利技术的目的是提供一种多页面资源注入方法及装置，以提高产品开发效率，减少技术输出和技术成本。为解决上述技术问题，本专利技术提供如下技术方案：一种多页面资源文件注入方法，包括：在建设目标网站过程中，获得页面参数配置信息，所述页面参数配置信息为在设定环境条件下配置完成的；根据所述页面参数配置信息，确定环境模式，并生成所述环境模式对应的Webpack配置文件；建立所述Webpack配置文件涉及的各个资源文件与页面文件的关联关系；根据所述关联关系，将各个资源文件分别注入到相关联的页面文件中。在本专利技术的一种具体实施方式中，在所述根据所述关联关系，将各个资源文件分别注入到相关联的页面文件中之前，还包括：生成各个资源文件的消息摘要，并进行混淆压缩合并操作。在本专利技术的一种具体实施方式中，所述环境模式为开发模式或者生产模式。在本专利技术的一种具体实施方式中，在所述接收页面参数配置信息之后，还包括：对所述页面参数配置信息中的各参数进行校验；如果检验通过，则执行所述根据所述页面参数配置信息，确定环境模式，并生成所述环境模式对应的Webpack配置文件的步骤。在本专利技术的一种具体实施方式中，还包括：如果检验失败，则输出失败提示信息。在本专利技术的一种具体实施方式中，所述页面参数配置信息中包括入口文件参数信息、指定目录参数信息、环境模式参数信息、资源文件注入相关参数信息。一种多页面资源文件注入装置，包括：配置信息获得模块，用于在建设目标网站过程中，获得页面参数配置信息，所述页面参数配置信息为在设定环境条件下配置完成的；配置文件生成模块，用于根据所述页面参数配置信息，确定环境模式，并生成所述环境模式对应的Webpack配置文件；关联关系建立模块，用于建立所述Webpack配置文件涉及的各个资源文件与页面文件的关联关系；文件注入模块，用于根据所述关联关系，将各个资源文件分别注入到相关联的页面文件中。在本专利技术的一种具体实施方式中，还包括预处理模块，用于：在所述根据所述关联关系，将各个资源文件分别注入到相关联的页面文件中之前，生成各个资源文件的消息摘要，并进行混淆压缩合并操作。在本专利技术的一种具体实施方式中，还包括参数校验模块，用于：在所述接收页面参数配置信息之后，对所述页面参数配置信息中的各参数进行校验；如果检验通过，则触发所述配置文件生成模块。在本专利技术的一种具体实施方式中，还包括信息提示模块，用于：在所述参数校验模块检验失败时，输出失败提示信息。应用本专利技术实施例所提供的技术方案，在建设目标网站过程中，获得页面参数配置信息，根据页面参数配置信息，确定环境模式，并生成环境模式对应的Webpack配置文件，基于该Webpack配置文件，建立其涉及的各个资源文件与页面文件的关联关系，根据关联关系，将各个资源文件分别注入到相关联的页面文件中。资源文件基于配置式的方式，自动为页面文件注入对应的资源文件，克服了现有技术中手动将资源文件写入到页面文件中的缺点，提高了产品开发效率，减少了技术输出和技术成本。附图说明为了更清楚地说明本专利技术实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本专利技术的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。图1为本专利技术实施例中一种多页面资源注入方法的实施流程图；图2为本专利技术实施例中一种多页面资源注入装置的结构示意图。具体实施方式为了使本
的人员更好地理解本专利技术方案，下面结合附图和具体实施方式对本专利技术作进一步的详细说明。显然，所描述的实施例仅仅是本专利技术一部分实施例，而不是全部的实施例。基于本专利技术中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本专利技术保护的范围。参见图1所示，为本专利技术实施例所提供的一种多页面资源文件注入方法的实施流程图，该方法可以包括以下步骤：S110：在建设目标网站过程中，获得页面参数配置信息。页面参数配置信息为在设定环境条件下配置完成的。在本专利技术实施例中，在建设目标网站过程中，开发者可以先对页面相关参数进行配置。本专利技术实施例利用Webpack技术进行多页面资源文件注入。开发者在配置页面相关参数之前，需安装相关环境和工具，主要包括Node.js，附带npm。Node.js是一个基于ChromeJavaScript运行时建立的平台，用于方便搭建响应速度快、易于扩展的网络应用。Node.js使用事件驱动，非阻塞I/O模型而得以轻量和高效，非常适合在分布式设备上运行数据密集型的实时应用。npm为一个基于Node.js的包管理器，可以使用其中的各种基于Node.js的开源库。相关环境和工具安装成功后，可以执行cmd命令，安装依赖包。因为Webpack是一个开源的JavaScript模块包。Webpack需要具有依赖关系的模块，并生成表示这些模块的静态资产。其需要依赖关系并生成一个依赖图，允许开发者使用模块化方法进行Web应用程序开发。进而，开发者可以在以上设定环境条件下配置页面参数。在本专利技术实施例中，页面参数配置信息中可以包括入口文件参数entry信息、指定目录参数directories信息、环境模式参数信息、资源文件注入相关参数信息。其中，环境模式为开发模式或者生产模式。资源文件注入相关参数主要包括页面标题、页面所需注入的入口文件列表、要被注入资源的页面文件以及编译生成的文件等。配置成功后，可以将页面参数配置信息发送给后台。后台获得页面参数配置信息后，可以继续执行步骤S120的操作。在本专利技术的一种具体实施方式中，在步骤S110之后，该方法还可以包括以下步骤：对页面参数配置信息中的各参数进行校验，如果校验通过，则继续执行步骤S120的操作。获得页面参数配置信息后，可以先对页面参数配置信息中的各参数进行校验，确定各参数的合法性，如果校验通过，则继续执行步骤S120的操作，否则，可以不做任何操作，或者，在校验失败时，输出失败提示信息，以便开发者自行检查页面参数配置信息中各参数的合法性。S120：根据页面参数配置信息，确定环境模式，并生成环境模式对应的Webpack配置文件。页面参数配置信息中包含环境模式参数信息。获得页面参数配置信息后，可以从页面参数配置信息中提取环境模式参数信息，进而确定环境模式。并基于该环境模式，生成该环境模式对应的Webpack配置文件。不同环境模式下可以执行不同的Webpack配置。举例而言，如果该环境模式为开发模式，则生成的Webpack配置文件中需配置代码热加载功能，以适应本地开发需要。如果该环境模式为生产模式，则生成的本文档来自技高网...

【技术保护点】
一种多页面资源文件注入方法，其特征在于，包括：在建设目标网站过程中，获得页面参数配置信息，所述页面参数配置信息为在设定环境条件下配置完成的；根据所述页面参数配置信息，确定环境模式，并生成所述环境模式对应的Webpack配置文件；建立所述Webpack配置文件涉及的各个资源文件与页面文件的关联关系；根据所述关联关系，将各个资源文件分别注入到相关联的页面文件中。

【技术特征摘要】
1.一种多页面资源文件注入方法，其特征在于，包括：在建设目标网站过程中，获得页面参数配置信息，所述页面参数配置信息为在设定环境条件下配置完成的；根据所述页面参数配置信息，确定环境模式，并生成所述环境模式对应的Webpack配置文件；建立所述Webpack配置文件涉及的各个资源文件与页面文件的关联关系；根据所述关联关系，将各个资源文件分别注入到相关联的页面文件中。2.根据权利要求1所述的多页面资源文件注入方法，其特征在于，在所述根据所述关联关系，将各个资源文件分别注入到相关联的页面文件中之前，还包括：生成各个资源文件的消息摘要，并进行混淆压缩合并操作。3.根据权利要求1所述的多页面资源文件注入方法，其特征在于，所述环境模式为开发模式或者生产模式。4.根据权利要求1至3任一项所述的多页面资源文件注入方法，其特征在于，在所述接收页面参数配置信息之后，还包括：对所述页面参数配置信息中的各参数进行校验；如果检验通过，则执行所述根据所述页面参数配置信息，确定环境模式，并生成所述环境模式对应的Webpack配置文件的步骤。5.根据权利要求4所述的多页面资源文件注入方法，其特征在于，还包括：如果检验失败，则输出失败提示信息。6.根据权利要求5所述的多页面资源文件注入方法，其特征在于，所述页面参...

【专利技术属性】
技术研发人员：林文康，朱浩然，
申请(专利权)人：金蝶软件中国有限公司，
类型：发明
国别省市：广东,44