申请/专利权人：深圳市轻松信息科技有限公司

申请日：2024-04-15

公开（公告）日：2024-06-25

公开（公告）号：CN118245104A

主分类号：G06F8/71

分类号：G06F8/71;G06F8/38;G06F8/41;G06F8/76;G06F8/36;G06F16/16

优先权：

专利状态码：在审-公开

法律状态：2024.06.25#公开

摘要：本发明公开了一种基于webpack打包jQuery框架的项目架构管理方法，其包括基于脚手架webpack，配置webpack和webpack插件，把pages下面的目录打包成对应的html页面、css、js文件；并将其存储在对应的目录中；打开终端并进入项目所在目录，获取package.json中的scripts中的执行命令，根据执行命令执行npmrundev在开发时实时预览效果；或者运行npmrunbuild执行打包上线任务。本发明实现了一个基于webpack和jQuery的html、css、js分离，公用头部文件和公用底部文件分离的，可灵活创建新项目可以使用现代工程化、css预编译器，可代理接口地址解决接口跨域问题，es6新语法并同时可实时预览运行，和打包上线的开箱即用的项目架构管理方法。

主权项：1.一种基于webpack打包jQuery项目的架构管理方法，其特征在于：1在使用jQuery框架的项目中，使用webpack-dev-server在本地启动一个web服务，每次修改能实时刷新页面，实时预览到修改效果。2通过wepack和sass、less预编译器，能自动给一些有兼容性的样式属性增加浏览器前缀，减低了兼容不同浏览器间的工作量。3通过配置webpack-dev-server的代理功能，解决本地开发的时候接口跨域的问题。4把公共的头部内容写在header.html，通过手写webpack插件，打包后会自动把header.html中的内容替换到每个带有headerid＝"header"header占位的页面。从而简化了重复代码，提高复用性和可维护性。5把公共的底部内容写在footer.html，通过手写webpack插件，打包后会自动把footer.html中的内容替换到每个带有footerid＝"footer"footer占位的页面。从而简化了重复代码，提高复用性和可维护性。6新增一个header.scss，为header.html单独写样式表，通过手写webpack插件，然后打包后会把header.scss打包成header.css，并且自动插入到每个带有！--headerlink--占位的页面。7新增一个footer.scss，为footer.html单独写样式表，通过手写webpack插件，然后打包后会把footer.scss打包成footer.css，并且自动插入到每个带有！--footerlink--占位的页面。8在本发明中，webpack把所有打包过的样式文件和javascript文件都会生成一个md5哈希值，这样每次修改文件后就会生成不同的文件名，从而解决了样式和js在本地浏览器缓存的问题。

全文数据：

权利要求：

百度查询： 深圳市轻松信息科技有限公司 一种基于webpack打包jQuery项目的架构管理方法

免责声明
1、本报告根据公开、合法渠道获得相关数据和信息，力求客观、公正，但并不保证数据的最终完整性和准确性。
2、报告中的分析和结论仅反映本公司于发布本报告当日的职业理解，仅供参考使用，不能作为本公司承担任何法律责任的依据或者凭证。

阅读全文 双屏查看 官方信息 专利公告 收藏专利 下载PDF 下载WORD