CN109284472A - 基于webpack的前端网页加载方法、存储介质 - Google Patents

基于webpack的前端网页加载方法、存储介质 Download PDF

Info

Publication number
CN109284472A
CN109284472A CN201811359821.9A CN201811359821A CN109284472A CN 109284472 A CN109284472 A CN 109284472A CN 201811359821 A CN201811359821 A CN 201811359821A CN 109284472 A CN109284472 A CN 109284472A
Authority
CN
China
Prior art keywords
file
configuration
under
running environment
static
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN201811359821.9A
Other languages
English (en)
Other versions
CN109284472B (zh
Inventor
刘德建
陈铭
高举全
郭玉湖
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Fujian Hua Yu Education Technology Co Ltd
Original Assignee
Fujian Hua Yu Education Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Fujian Hua Yu Education Technology Co Ltd filed Critical Fujian Hua Yu Education Technology Co Ltd
Priority to CN201811359821.9A priority Critical patent/CN109284472B/zh
Publication of CN109284472A publication Critical patent/CN109284472A/zh
Application granted granted Critical
Publication of CN109284472B publication Critical patent/CN109284472B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00—Arrangements for program control, e.g. control units
    • G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44—Arrangements for executing specific programs
    • G06F9/445—Program loading or initiating
    • G06F9/44521—Dynamic linking or loading; Link editing at or after load time, e.g. Java class loading

Landscapes

  • Engineering & Computer Science (AREA)
  • Software Systems (AREA)
  • Theoretical Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Engineering & Computer Science (AREA)
  • General Physics & Mathematics (AREA)
  • Information Transfer Between Computers (AREA)
  • Information Retrieval, Db Structures And Fs Structures Therefor (AREA)

Abstract

本发明提供基于webpack的前端网页加载方法、存储介质，方法包括：配置开启CDN服务器加载的运行环境；打包前端代码，生成对应的静态文件并存储在本地；配置在所述运行环境下，将所述静态文件上传至CDN服务器，以及在入口文件遍历获取本地的静态文件的文件名列表，在列表中的各个文件名中添加对应所述CDN服务器的域名和对应代码类型的资源标签；在所述运行环境下，浏览器通过访问所述入口文件，依据所述资源标签对应的文件名记载的域名从所述CDN服务器加载所述静态文件。本发明能够实现在预设的运行环境下，利用CDN服务器分担本地服务器的工作，从而显著提升前端网页加载的性能，优化用户体验。

Description

基于webpack的前端网页加载方法、存储介质
技术领域
本发明涉及前端工程化领域，具体涉及基于webpack的前端网页加载方法、存储介质。
背景技术
在前端工程化的大背景下，前端代码变得越来越庞大。如果将前端代码发布到一个普通的web服务器，其加载性能是非常低下的，所以更好的做法是将前端代码发布到CDN服务器，然后进行静态加载。
但是传统的web发布方式无法直接应用于目前流行的基于node+webpack的前端开发架构中，这是因为传统的web不是前后端分离的，使用的是模板语言例如smarty。web端的开发需要服务端环境，而node+webpack实现了前后端分离，完全不需要服务端环境。由于两种开发方式截然不同，所以旧的开发流程以及相关技术方案无法直接套用到新的开发流程中。
本发明针对目前流行的前端工程化开发方式，提供了一种基于webpack的前端网页加载方案，能够优化静态资源的加载方式，同时解决以下问题：
1、发布过程能够自动完成，无需人工干预；
2、兼容node+webpack的开发方式；
3、支持不同环境随意切换本地加载或者CDN加载，例如开发环境下需要本地加载，正式环境则使用CDN加载。
发明内容
本发明所要解决的技术问题是：提供一种基于webpack的前端网页加载方法、存储介质，能兼容node+webpack的开发方式和支持加载方式的切换。
为了解决上述技术问题，本发明采用的技术方案为：
基于webpack的前端网页加载方法，包括：
配置开启CDN服务器加载的运行环境；
打包前端代码，生成对应的静态文件并存储在本地；
配置在所述运行环境下，将所述静态文件上传至CDN服务器，以及
在入口文件遍历获取本地的静态文件的文件名列表，在列表中的各个文件名中添加对应所述CDN服务器的域名和对应代码类型的资源标签；
在所述运行环境下，浏览器通过访问所述入口文件，依据所述资源标签对应的文件名记载的域名从所述CDN服务器加载所述静态文件。
本发明提供的另一个技术方案为：
一种计算机可读存储介质，其上存储有计算机程序，所述程序在被处理器执行时，能实现上述基于webpack的前端网页加载方法所包含的步骤。
本发明的有益效果在于：可以灵活配置需要开启CDN服务器的运行环境，支持不同环境随意切换本地加载或者CDN加载；配置在上述运行环境下将自动上传静态文件至CDN，自动完成发布流程，而无需人工干预；在入口文件将静态文件的各个文件名添加指向CDN的域名和资源标签，在上述运行环境下时，能基于标签自动记载对应域名的静态文件，实现CDN静态加载方式能兼容node+webpack的开发方式。本发明能利用CDN服务器分担本地服务器的工作，从而显著提升前端网页加载的性能，优化用户体验。
附图说明
图1为本发明基于webpack的前端网页加载方法的流程示意图；
图2为本发明实施例二的自动编译和发布的流程的交互图；
图3为本发明实施例三的前端页面自动加载流程的交互图。
具体实施方式
为详细说明本发明的技术内容、所实现目的及效果，以下结合实施方式并配合附图予以说明。
本发明最关键的构思在于：在指定运行环境下，利用CDN服务器分担本地服务器的工作，显著提升前端网页加载的性能。
本发明涉及的技术术语解释:
请参照图1，本发明提供基于webpack的前端网页加载方法，包括：
配置开启CDN服务器加载的运行环境；
打包前端代码，生成对应的静态文件并存储在本地；
配置在所述运行环境下，将所述静态文件上传至CDN服务器，以及
在入口文件遍历获取本地的静态文件的文件名列表，在列表中的各个文件名中添加对应所述CDN服务器的域名和对应代码类型的资源标签；
在所述运行环境下，浏览器通过访问所述入口文件，依据所述资源标签对应的文件名记载的域名从所述CDN服务器加载所述静态文件。
从上述描述可知，本发明的有益效果在于：
1、发布过程能够自动完成，无需人工干预
2、兼容node+webpack的开发方式
3、支持不同环境随意切换本地加载或者cdn加载，例如开发环境下需要本地加载，正式环境则使用cdn加载。
进一步的，还包括：
配置在非所述运行环境下，在入口文件遍历获取本地的静态文件的文件名列表，在列表中的各个文件名中添加对应代码类型的资源标签；
在非所述运行环境下，浏览器通过访问所述入口文件，依据所述资源标签对应的文件名从本地服务器加载所述静态文件。
由上述描述可知，在非指定的运行环境下，将使用默认的本地静态加载方式，从而支持不同环境随意切换，更好的满足不同需求。
进一步的，所述配置开启CDN服务器加载的运行环境，具体为：
通过修改node工程下的第一配置文件，配置使用CDN服务器加载静态文件的运行环境。
由上述描述可知，在一具体实施方式中，可以通过修改node工程下的配置文件，实现CDN静态加载运行环境的指定，具有操作方便，易于实现的特点。
进一步的，所述配置在所述运行环境下，将所述静态文件上传至CDN服务器，具体为：
获取一脚本及其执行指令，所述脚本对应将本地存储有所述静态文件的文件夹上传至CDN服务器；
配置在所述运行环境下，通过触发所述执行指令执行所述脚本。
由上述描述可知，能在指定CDN加载的运行环境下，通过配置自动触发执行指令完成本地静态文件自动上传至CDN服务器，为后续从CDN服务器加载静态文件提供支持。
进一步的，所述配置在所述运行环境下，通过触发所述执行指令执行所述脚本，具体为：
通过修改node工程下的第二配置文件其中的webpack插件的第三配置文件，
配置在所述运行环境下，执行所述生成对应的静态文件并存储在本地的步骤之后，通过触发所述执行指令执行所述脚本；以及
配置在非所述运行环境下，执行所述生成对应的静态文件并存储在本地的步骤之后，从本地加载所述静态文件。
由上述描述可知，在一具体实施方式中，可以通过修改node工程的配置文件下的webpack插件的配置文件，实现在打包过程对应预设的不同的静态加载方式，判断是直接本地加载静态文件还是上传静态文件至CDN为CDN静态加载做准备。
进一步的，所述在入口文件遍历获取本地的静态文件的文件名列表，在列表中的各个文件名中添加对应所述CDN服务器的域名和对应代码类型的资源标签，具体为：
依据所述第三配置文件的修改，通过修改node工程下的入口文件，配置在所述运行环境下，将webpack插件的公共路径指向所述CDN服务器的域名，然后遍历本地的静态文件，获取对应静态js代码的第一文件名列表和对应静态css代码的第二文件名列表，并在所述第一文件名列表和第二文件名列表的各个文件名中添加对应所述CDN服务器的域名，最后在第一文件名列表的各个文件名中添加script标签，在第二文件名列表的各个文件名中添加link标签。
由上述描述可知，在一具体实施方式中，可以通过修改node工程下的入口文件，在静态文件的各个文件名中添加对应的资源标签以及指向CDN的域名，从而实现在依据资源标签调用时能依据域名从CDN服务器获取所需的资源，进而实现CDN加载静态文件在node+webpack的开发方式中的兼容。
本发明提供的另一个技术方案为：
一种计算机可读存储介质，其上存储有计算机程序，所述程序在被处理器执行时，能实现上述基于webpack的前端网页加载方法所包含的步骤。
从上述描述可知，本发明的有益效果在于：对应本领域普通技术人员可以理解实现上述技术方案中的全部或部分流程，是可以通过计算机程序来指令相关的硬件来实现的，所述的程序可存储于一计算机可读取的存储介质中，该程序在执行时，可包括如上述各方法的流程。
其中，所述的存储介质可以是磁盘、光碟、只读存储记忆体(Read-OnlyMemory，ROM)或随机存储记忆体(Random Access Memory，RAM)等。
实施例一
请参阅图1，本实施例提供基于webpack的前端网页加载方法，包括：
S1：配置开启CDN服务器加载的运行环境；
具体的，可以通过修改node工程下的第一配置文件，配置使用CDN服务器加载静态文件的运行环境。
通过该步骤，能实现通过配置，指定需要启动CDN加载静态文件的运行环境，除此之外的其他运行环境下将禁用CDN加载，而使用默认的本地加载。
S2：打包前端代码，生成对应的静态文件并存储在本地；
具体将通过webpack对前端代码进行打包，生成静态文件。打包生成的静态文件默认存储在本地。默认的，本地的静态文件的文件名列表中的各个文件名中的域名指向的是本地，由本地服务器加载该静态文件。
S3：配置在所述运行环境下，将所述静态文件上传至CDN服务器；
即配置在上述S1指定的运行环境下时，将自动从给本地上传静态文件至CDN服务器。
在一具体实施方式中，该步骤包括：
S31：获取一脚本及其执行指令，所述脚本对应将本地存储有所述静态文件的文件夹上传至CDN服务器；
S32：配置在所述运行环境下，通过触发所述执行指令执行所述脚本。
通过编写自动将本地存储静态文件的文件夹上传至CDN服务器的脚本，在该脚本完成后，设置执行该脚本的执行命令，便可在指定的时机自动执该脚本对应的步骤，从而实现静态文件自动上传至CDN。
具体而言，上述的S32步骤的具体实现过程包括：
通过修改node工程下的第二配置文件其中的webpack插件的第三配置文件，
配置在所述运行环境下，执行所述生成对应的静态文件并存储在本地的步骤之后，通过触发所述执行指令执行所述脚本；以及
配置在非所述运行环境下，执行所述生成对应的静态文件并存储在本地的步骤之后，从本地加载所述静态文件。
通过上述配置，能在打包环境下对应步骤S1配置的运行环境下要开始CDN加载，即webpack将不会生成加载静态文件代码。这个时候，我们就可以自定义加载方式，首先通过在此时触发执行指令，执行上述脚本，实现将本地的静态文件自动上传至CDN服务器，为后续能从CDN加载提供支持。而在对应非上述的运行环境下时不需要开始CDN加载，即webpack会自动生成加载静态文件的代码，从本地加载静态文件，这也是现有默认的加载方式，无需改动。
S4：配置在所述运行环境下，在入口文件遍历获取本地的静态文件的文件名列表，在列表中的各个文件名中添加对应所述CDN服务器的域名和对应代码类型的资源标签。
具体而言，可以依据上述步骤S32中的第三配置文件的修改，通过修改node工程下的入口文件，配置在所述运行环境下，首先，将webpack插件的公共路径指向所述CDN服务器的域名；然后，遍历本地的静态文件，获取对应静态js代码的第一文件名列表和对应静态css代码的第二文件名列表，并在所述第一文件名列表和第二文件名列表的各个文件名中添加对应所述CDN服务器的域名；最后，在第一文件名列表的各个文件名中添加script标签，在第二文件名列表的各个文件名中添加link标签。
该步骤的目的是，通过修改静态文件中各个文件名的名称，将其对应本地的域名修改成指向CDN服务器的域名，使其在依据标签加载资源时能从CDN器中获取，而非原本默认的本地。所述资源标签也叫加载标签，用于执行资源加载的操作，入口文件下存储有多个不同类型的资源标签，在用户通过浏览器访问时，将依据浏览器发起的请求，从入口文件下依据对应的资源标签进行资源加载，以获取请求对应的页面。
S5：配置在非所述运行环境下，在入口文件遍历获取本地的静态文件的文件名列表，在列表中的各个文件名中添加对应代码类型的资源标签；
S6：在非所述运行环境下，浏览器通过访问所述入口文件，依据所述资源标签对应的文件名从本地服务器加载所述静态文件。
上述S5和S6的步骤对应的是当处于非步骤S1指定的运行环境下时，便依据现有的静态文件加载方式进行资源获取。
实施例二
请参照图2和图3，本实施例对应实施例一，提供自动编译和发布的流程，如图2所示，包括：
一、build发布命令：向webpack发送执行指令；
二、webpack打包命令：
1、对前端代码进行打包，生成静态文件；
2、若打包环境下不需要开始CDN加载，则设置inject＝true；
3、若打包环境下要开始CDN加载，则设置inject＝false；同时指向inex.html入口模板文件；
三、inex.html入口模板文件：循环本地的静态文件的各个文件名，加上CDN域名，并生成加载标签；
四、build发布命令：向autoupioad自动上传命令发起执行指令autoupioad的请求；
五、autoupioad自动上传命令：对应上述二、3步骤：打包环境要开始CDN加载，则将打包后的静态文件上传至CDN服务器。
如图3所示，同时提供前端网页自动加载流程：
一、用户通过浏览器向index.html发起一网页的加载请求；
二、index.html接收到请求后，依据请求对应的资源标签，判断资源标签的域名在本地还是在CDN服务器；若在本地，则向本地服务器加载当前域名下的静态文件；若在CDN，则从CDN服务器加载静态文件；然后将加载得到的静态文件返回给浏览器；
三、浏览器依据接收到的静态文件进行渲染，获取页面。
实施例三
本实施例对应实施例一或实施例二，提供一具体运用场景：
第一步：修改node工程下的package.json配置文件(位于项目工程的根目录)，在里面增加新配置项“cdn”，其属性“env”表示当前工程需要在哪些环境使用CDN加载静态文件。例如：
{
cdn:{
“env”:“test,production”
}
}
上述配置例子表示在test(测试环境)和production(生产环境)下，需要开启CDN动态加载。
第二步：修改node工程下的webpack.config.js文件(webpack工具程序的配置文件，一般位于项目根目录下)，对webpack插件HtmlWebpackPlugin(webpack工具程序的一个插件程序)下的inject属性进行以下修改，规则如下：
如果当前运行环境属于第一步中package.json配置cdn.env下列举的环境，那么将inject设置为false，否则设置为true；
其中，inject属性用于通知webpack插件，是否自动生成加载静态文件的代码，当inject＝true，那么webpack会自动生成加载静态文件的代码，从本地加载静态文件；当值为inject＝false的时候，webpack将不会生成加载静态文件代码，这个时候，我们就可以通过自定义，将原本由webpack生成加载静态文件代码的任务给具体开发者自己生成，如使其从cdn加载静态代码。
第三步：修改node工程下的入口模板文件(通常是index.html或者index.ejs)，根据htmlWebpackPlugin.options.inject(就是第二步的配置)的值，在body标签(所有的html文件，都必须包含有body标签)的尾部进行以下修改：
如果为true：则返回什么也不做；
如果为false：设置_webpack_public_path__为CDN域名，然后遍历htmlWebpackPlugin.files.js(静态js代码的文件名列表)和htmlWebpackPlugin.files.css(静态css代码的文件名列表)得到webpack编译之后的静态文件名，并且在文件名前面添加cdn服务器的域名。
例如：从htmlWebpackPlugin.files.js得到一个js文件名：a_v1_1_12.js；那么拼接cdn服务器域名后，转换为：http://www.cdn.com/a_v1_1_12.js。
通过该步骤，将本地加载修改为CDN加载。
第四步：根据上一步得到的js和css的文件地址，分别使用script标签和link标签进行加载。
在该步骤加上script和link标签后，浏览器就会执行加载指令，加载指定位置的文件。
例如js地址为http://www.cdn.com/a_v1_1_12.js，则在入口文件中写成：<script type＝”text/javascript”src＝”http://www.cdn.com/a_v1_1_12.js”></script>。
第三步和第四步的具体实现的伪代码如下：
第五步：
编写自动将存储在本地文件夹的静态文件上传到cdn服务器的脚本。假设该脚本完成后，执行命令为：“node cdnUpload”。
第六步：
修改node工程的package.json配置文件，在script属性下(这个属性下列举出了当前工程可以自行的命令)，增加一个命令，取名autoupload，这个值就是上一步自动上传脚本的指令“node cdnUpload”。
例如：
{
scripts:{
autoupload:“node cdnUpload”
}
}
在之前编译命令后，追加cdnUpload命令，例如之前编译命令取名“build”，值是“webpack”那么追加之后就是：
{
scripts:{
build:“webpack&autoupload”
autoupload:“node cdnUpload”
}
}
其中，build是打包命令，有两个部分组成，一个是webpack编译程序，一个是autoUpload将前一步编译好的程序发布到CDN。
这一步的目的，就是在编译完成后，自动执行上传指令，将本地的静态文件发布到CDN服务器，使得整个流程的尽量自动化，减少人工干预。
实施例四
一种计算机可读存储介质，其上存储有计算机程序，所述程序在被处理器执行时，能实现上述实施例一至实施例三任意一个实施例所述的基于webpack的前端网页加载方法所包含的步骤。具体的步骤内容在此不再复述，详细请查阅实施例一至实施例三的记载。
综上所述，本发明提供的基于webpack的前端网页加载方法、存储介质，不仅能自动完成发布过程，无需人工干预，提供发布效率的同时减少失误；而且，还能兼容node+webpack的开发方式；进一步的，还能支持不同运行环境随意切换加载方式。本发明能够实现在预设的运行环境下，利用CDN服务器分担本地服务器的工作，从而显著提升前端网页加载的性能，优化用户体验。
以上所述仅为本发明的实施例，并非因此限制本发明的专利范围，凡是利用本发明说明书及附图内容所作的等同变换，或直接或间接运用在相关的技术领域，均同理包括在本发明的专利保护范围内。

Claims (7)

1.基于webpack的前端网页加载方法，其特征在于，包括：
配置开启CDN服务器加载的运行环境；
打包前端代码，生成对应的静态文件并存储在本地；
配置在所述运行环境下，将所述静态文件上传至CDN服务器，以及
在入口文件遍历获取本地的静态文件的文件名列表，在列表中的各个文件名中添加对应所述CDN服务器的域名和对应代码类型的资源标签；
在所述运行环境下，浏览器通过访问所述入口文件，依据所述资源标签对应的文件名记载的域名从所述CDN服务器加载所述静态文件。
2.如权利要求1所述的基于webpack的前端网页加载方法，其特征在于，还包括：
配置在非所述运行环境下，在入口文件遍历获取本地的静态文件的文件名列表，在列表中的各个文件名中添加对应代码类型的资源标签；
在非所述运行环境下，浏览器通过访问所述入口文件，依据所述资源标签对应的文件名从本地服务器加载所述静态文件。
3.如权利要求1所述的基于webpack的前端网页加载方法，其特征在于，所述配置开启CDN服务器加载的运行环境，具体为：
通过修改node工程下的第一配置文件，配置使用CDN服务器加载静态文件的运行环境。
4.如权利要求1所述的基于webpack的前端网页加载方法，其特征在于，所述配置在所述运行环境下，将所述静态文件上传至CDN服务器，具体为：
获取一脚本及其执行指令，所述脚本对应将本地存储有所述静态文件的文件夹上传至CDN服务器；
配置在所述运行环境下，通过触发所述执行指令执行所述脚本。
5.如权利要求4所述的基于webpack的前端网页加载方法，其特征在于，所述配置在所述运行环境下，通过触发所述执行指令执行所述脚本，具体为：
通过修改node工程下的第二配置文件其中的webpack插件的第三配置文件，
配置在所述运行环境下，执行所述生成对应的静态文件并存储在本地的步骤之后，通过触发所述执行指令执行所述脚本；以及
配置在非所述运行环境下，执行所述生成对应的静态文件并存储在本地的步骤之后，从本地加载所述静态文件。
6.如权利要求5所述的基于webpack的前端网页加载方法，其特征在于，所述在入口文件遍历获取本地的静态文件的文件名列表，在列表中的各个文件名中添加对应所述CDN服务器的域名和对应代码类型的资源标签，具体为：
依据所述第三配置文件的修改，通过修改node工程下的入口文件，配置在所述运行环境下，将webpack插件的公共路径指向所述CDN服务器的域名，然后遍历本地的静态文件，获取对应静态js代码的第一文件名列表和对应静态css代码的第二文件名列表，并在所述第一文件名列表和第二文件名列表的各个文件名中添加对应所述CDN服务器的域名，最后在第一文件名列表的各个文件名中添加script标签，在第二文件名列表的各个文件名中添加link标签。
7.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述程序在被处理器执行时，能实现上述权利要求1-6所述的基于webpack的前端网页加载方法所包含的步骤。
CN201811359821.9A 2018-11-15 2018-11-15 基于webpack的前端网页加载方法、存储介质 Active CN109284472B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201811359821.9A CN109284472B (zh) 2018-11-15 2018-11-15 基于webpack的前端网页加载方法、存储介质

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201811359821.9A CN109284472B (zh) 2018-11-15 2018-11-15 基于webpack的前端网页加载方法、存储介质

Publications (2)

Publication Number Publication Date
CN109284472A true CN109284472A (zh) 2019-01-29
CN109284472B CN109284472B (zh) 2022-06-07

Family

ID=65175241

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201811359821.9A Active CN109284472B (zh) 2018-11-15 2018-11-15 基于webpack的前端网页加载方法、存储介质

Country Status (1)

Country Link
CN (1) CN109284472B (zh)

Cited By (12)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109753622A (zh) * 2019-01-31 2019-05-14 天津字节跳动科技有限公司 静态资源管理方法、装置、存储介质及电子设备
CN110377274A (zh) * 2019-07-08 2019-10-25 紫光云技术有限公司 基于Single-Spa的微前端架构系统及开发、部署方法
CN110781083A (zh) * 2019-10-18 2020-02-11 苏宁消费金融有限公司 一种h5客户端代码设置多环境测试方法和系统
CN111459497A (zh) * 2020-04-10 2020-07-28 深圳市盟天科技有限公司 基于webpack的资源包编译方法、系统、服务器和存储介质
CN112015485A (zh) * 2020-08-14 2020-12-01 北京达佳互联信息技术有限公司 页面展示方法、装置、电子设备及存储介质
CN112269592A (zh) * 2020-10-30 2021-01-26 政采云有限公司 一种全局功能的生效方法、装置、设备及存储介质
CN112615908A (zh) * 2020-12-08 2021-04-06 广东荣文科技集团有限公司 网页处理方法、电子设备及相关产品
CN113114515A (zh) * 2021-05-12 2021-07-13 北京字节跳动网络技术有限公司 一种资源文件配置方法及装置
CN113343143A (zh) * 2021-05-24 2021-09-03 上海万物新生环保科技集团有限公司 一种流式加载网页模板的方法及设备
CN113420237A (zh) * 2021-05-21 2021-09-21 北京沃东天骏信息技术有限公司 一种信息处理方法及装置、存储介质
CN114363322A (zh) * 2022-01-05 2022-04-15 北京爱学习博乐教育科技有限公司 针对静态资源的cdn上传系统
CN115509546A (zh) * 2022-09-30 2022-12-23 再惠(上海)网络科技有限公司 前端部署的方法、装置、电子设备及存储介质

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20140215019A1 (en) * 2013-01-28 2014-07-31 Spencer Ahrens Static resource caching
CN104424239A (zh) * 2013-08-27 2015-03-18 北大方正集团有限公司 资源文件加载方法和装置
CN104426925A (zh) * 2013-08-21 2015-03-18 腾讯科技（深圳）有限公司 网页资源获取方法及装置
CN106293827A (zh) * 2016-08-08 2017-01-04 杭州玳数科技有限公司 一种通过配置文件来控制web前端发布的方法与系统
CN108337327A (zh) * 2018-04-26 2018-07-27 拉扎斯网络科技（上海）有限公司 一种资源获取方法和代理服务器

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
US20140215019A1 (en) * 2013-01-28 2014-07-31 Spencer Ahrens Static resource caching
CN104426925A (zh) * 2013-08-21 2015-03-18 腾讯科技（深圳）有限公司 网页资源获取方法及装置
CN104424239A (zh) * 2013-08-27 2015-03-18 北大方正集团有限公司 资源文件加载方法和装置
CN106293827A (zh) * 2016-08-08 2017-01-04 杭州玳数科技有限公司 一种通过配置文件来控制web前端发布的方法与系统
CN108337327A (zh) * 2018-04-26 2018-07-27 拉扎斯网络科技（上海）有限公司 一种资源获取方法和代理服务器

Non-Patent Citations (2)

* Cited by examiner, † Cited by third party
Title
WEIXIN_33858249: "《接口环境很多？静态资源要放cdn？不用修改代码，用webpack就可以（vue）》", 17 July 2017, CSDN，HTTPS://BLOG.CSDN.NET/WEIXIN_33858249/ARTICLE/DETAILS/89009595 *
吴浩麟: "《深入浅出Webpack》", 31 January 2018 *

Cited By (14)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN109753622A (zh) * 2019-01-31 2019-05-14 天津字节跳动科技有限公司 静态资源管理方法、装置、存储介质及电子设备
CN110377274A (zh) * 2019-07-08 2019-10-25 紫光云技术有限公司 基于Single-Spa的微前端架构系统及开发、部署方法
CN110781083B (zh) * 2019-10-18 2022-08-02 苏宁消费金融有限公司 一种h5客户端代码设置多环境测试方法和系统
CN110781083A (zh) * 2019-10-18 2020-02-11 苏宁消费金融有限公司 一种h5客户端代码设置多环境测试方法和系统
CN111459497A (zh) * 2020-04-10 2020-07-28 深圳市盟天科技有限公司 基于webpack的资源包编译方法、系统、服务器和存储介质
CN112015485A (zh) * 2020-08-14 2020-12-01 北京达佳互联信息技术有限公司 页面展示方法、装置、电子设备及存储介质
CN112269592A (zh) * 2020-10-30 2021-01-26 政采云有限公司 一种全局功能的生效方法、装置、设备及存储介质
CN112615908A (zh) * 2020-12-08 2021-04-06 广东荣文科技集团有限公司 网页处理方法、电子设备及相关产品
CN113114515A (zh) * 2021-05-12 2021-07-13 北京字节跳动网络技术有限公司 一种资源文件配置方法及装置
CN113114515B (zh) * 2021-05-12 2022-09-13 北京字节跳动网络技术有限公司 一种资源文件配置方法及装置
CN113420237A (zh) * 2021-05-21 2021-09-21 北京沃东天骏信息技术有限公司 一种信息处理方法及装置、存储介质
CN113343143A (zh) * 2021-05-24 2021-09-03 上海万物新生环保科技集团有限公司 一种流式加载网页模板的方法及设备
CN114363322A (zh) * 2022-01-05 2022-04-15 北京爱学习博乐教育科技有限公司 针对静态资源的cdn上传系统
CN115509546A (zh) * 2022-09-30 2022-12-23 再惠(上海)网络科技有限公司 前端部署的方法、装置、电子设备及存储介质

Also Published As

Publication number Publication date
CN109284472B (zh) 2022-06-07

Similar Documents

Publication Publication Date Title
CN109284472A (zh) 基于webpack的前端网页加载方法、存储介质
Pitt Pro PHP 8 MVC
US20130167128A1 (en) Application Compiling
Hales HTML5 and JavaScript Web Apps
US20170132023A1 (en) Monitoring And Actuation Of View Controller Parameters To Reach Deep States Without Manual Developer Intervention
CN112230918A (zh) 一种使用iframe内嵌网页的web端开发方法
CN110045956A (zh) 组件的配置方法、装置、设备及可读存储介质
US20220300262A1 (en) Method for constructing, running and implementing cross-platform application, terminal, server and system
CN104063247A (zh) 一种应用程序的调用方法和系统
CN105302558A (zh) 一种用于多客户端的内容展现系统及方法
CN104834594B (zh) web系统测试方法及装置
CN104461893A (zh) 数据处理方法与数据处理装置
Rogers Developing portable mobile web applications
CN109144575A (zh) 跨操作系统运行应用的装置、方法、电子设备和存储器
Shepherd Microsoft ASP. NET 4 Step by Step
Gordon Isomorphic Web Applications: Universal Development with React
Robbins Application testing with Capybara
Justin et al. Build Your First Ionic App
KC Developing and Implementing Web Components
Stenroos Headless WordPress development with React using Gatsby. js
Barry Doing IT the app engine way
Liu Decentralized application-a news forum based on react and solid
Borggreve Server-Side Enterprise Development with Angular: Use Angular Universal to pre-render your web pages, improving SEO and application UX
Tian Based on the OSGi framework LIS isomers Big data collection practice
Freeman et al. Configuring Applications

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant