美文网首页
webpack 解决的痛点

webpack 解决的痛点

作者: dulei_fe | 来源:发表于2016-10-31 00:13 被阅读0次

webpack

webpack -模块化加载器,同时支持amd,cmd等加载规范。

1、AMD模块规范开发,使用requirejs实现,使用rjs打包,最终导致的结果是,输出的项目臃肿,
肿的就像一坨狗不理……不忍直视
2、使用gulp进行打包,这一点貌似没有可吐槽的地方,毕竟都是被grunt折磨过来的……
3、数据的渲染使用模板引擎,这就意味着你要手动管理DOM,这样,你的业务代码参杂着
你的数据处理、DOM管理,满屏幕的毛线……
4、模块化不足,虽然使用require进行了模块管理,但是大部分业务逻辑还是充斥在一个文
件里,这与最近流行的组件化概念冰火不容,拒绝落后……
5、诸如 扩展性 、 维护性 我想早已不言而喻,不需赘述,再述就真TM是累赘了。

要解决的问题
1、要使构建输出的项目像你邻家小妹妹一样、瘦的皮包骨。
2、要实现真正的模块化、组件化的开发方式,真正去解决维护难、扩展难的问题。
(从此不怕产品汪)
3、业务逻辑专注数据处理,手动管理DOM的年代就像……像什么呢?
(毕竟成人用品也越来越自动化了)

解决方案tips


1. 为什么老项目构建臃肿不堪?
    基于requirejs进行打包,会把项目所有的一来都打包到一个文件里,如果项目中同时依赖一个模块,
rjs 并不能提取为公共模块。使用webpack配合响应loader,来完成加载和构建。

2.老项目为什么模块化不足?
    老项目的模块化,仅仅体现在js层面,解决了模块引用的问题,但在开发方式上,依然可以
看做是过程式的, 这样的结果就导致了项目的难扩展和难维护,让开发人员在与产品汪的对峙中,并不从容。

3、如何避免手动管理DOM?
    如果你在做数据展示这一块的开发工作,相信你一定体会颇深,发送http请求到服务端,
拿到返回的数据后手动渲染DOM至页面,这是最原始的开发方式,无非再加一个模板引擎之类的,
但最终还是避免不了手动渲染,如果页面逻辑复杂,比如给你来一个翻页的功能,再来一个筛选项,
估计你会觉得世界并不那么美好。

webpack 优势


1.代码分割:
  webpack支持二种依赖加载:同步和异步。同步的依赖会在编译时直接打包输出到目的文件。异步加载会单
独生成代码块,只有在浏览器中需要时才会异步加载这些代码块。
2.Loaders:
  默认加载js,通过loaders来把其他类型的资源转换成js输出。
3.各种插件
  webpack提供强大插件来提高工作效率。

安装


全局安装

npm i webpack -g

局部安装

同样也可以在项目中安装。
此时,应该先初始化npm项目

npm init
npm i webpack -save-dev

此时会写入到package.json中。

基本使用

——————待续-----

相关文章

  • webpack 解决的痛点

    webpack 解决方案tips webpack 优势 安装 全局安装 npm i webpack -g 局部安装...

  • webpack 代理与koa服务 api mockjs 数据

    目的: 解决开发联调中的痛点(存在跨域,不能请求),前端与后端本地联调阻断,webpack 代理转发解决请求 双向...

  • 模块懒加载

    痛点 首屏加载缓慢,目前的体积包过于庞大 解决思路 通过webpack-bundle-analyzer进行体积分析...

  • 痛点,解决痛点

    前段时间,天天运动,空调一吹脖子受凉,几乎是疼痛难忍。 正好周六我参加一个拆书+演讲分享会,其中一个是健身行业的朋...

  • 【方法论】制定用户行为流程图,发现真实痛点

    “ 如何通过制定用户行为流程图来发现并解决用户背后的真实痛点” 【文章结构:发现痛点(主要)→验证痛点→解决痛点】...

  • 什么是痛点?如何解决痛点?

    痛点是什么? 痛点就是用户最痛的需求点,是用户最想解决的需求点。 如何解决痛点? 这是一个真实的故事,发生在沙特的...

  • 2020年3月12号 创业的过程就是一个不断解决痛点的过程

    创业就是一个不断找痛点并且解决痛点、解决矛盾的过程....谁能帮客户解决的痛点多、矛盾多,谁就可以从中获得商机.....

  • 解决业务痛点

    今天分享的内容分成三部分,一,关于痛点问题,一个是人力本身的痛点,通业务,建共识,带团队,拿结果,而业务的痛点也按...

  • (转)使用webpack.DllPlugin与webpack.D

    解决webpack打包速度太慢使用webpack插件webpack.DllPlugin与webpack.DllRe...

  • 如何挖掘客户痛点

    如何挖掘客户痛点 客户的痛点,就是需求的本质,一切的购买行为,也都是建立在解决痛点,解决需求上,所以必须要学会挖掘...

网友评论

      本文标题:webpack 解决的痛点

      本文链接:https://www.haomeiwen.com/subject/awwuuttx.html