• 怎样学习webpack


    很多朋友可能都知道webpack,也见过webpack的代码,但是不明白里面一坨一坨的东西是什么意思,到底有什么用处!我们每个人学习一个新东西可能都会有这个过程,但是我个人觉得webpack可能是最混沌的一个东西,因为他得配置很多,功能很强大,让很多人望而却步。

    下面就分享我之前学习的过程

    一个新事物我们不能要求自己把他得全部东西都学会了,也不能直接去看文档直接去写demo,这样的意义并不大,你看文档如果仔细看肯定能看得懂,但是你看过之后能记忆多少,对你自己有多大帮助那就说不准了,首先要明确我为什么要学这个东西,他有什么特性,能解决实际开发中的什么问题,他得应用场景是什么,有人说了与时俱进,好多公司都在用,我也要用,的确是很多公司都在用,但是为什么都用呢?只是因为他是新东西吗?他肯定是有一些独特的特性,才会让大家趋之若鹜。想想周边的声音就可以听到webpack具体能做什么,我们顺着一些路子去摸索,去思考,把问题引出来,然后一个一个的击破,问题解决的我们自然也就学会了。

    1.webpack主要是和react结合做单页开发,那好我们就去实现一个简单的配置,通过查找文档我们发现他得基本配置,入口,出口,css配置,babel配置 等 然后一个一个去看去查,也可以到github上面下载一些源码来看,这样的代码有很多

    2.webpack本身多种模块化方式 如 es6 cmd amd,现在肯定是用es6的了,当然cmd本身就是node采用的方式,我们知道es6的代码是不能直接被浏览器支持的,那我们就会想到babel,再去查babel的配置,然后写demo去实现

    3.公共代码提取, 我们为什么要公共代码提取呢?防止代码的重复下载 充分利用缓存机制,这个时候我们在去查怎样实现,查文档,找代码等

    4.实现缓存机制 也就是js文件名后面带一串hash,hash是通过文件内容进行生成的,我们在去查,进行测试,最终达到我们想要的结果

    5.自动刷新页面 代码热更新等   这些都是我们要用到的特性,都可以作为我们的问题去查找相关的解决方案,在通过测试进行修复

    6.结合node web服务怎样配置 ,也就是node层做为web服务器,但同时webapck也需要做为监听js代码开启服务,怎样结合呢?

    上面举例了几个实际的问题,其实学习一个新技术,我们要先做到对这个东西的大致了解然后去挖掘问题,带着问题去,解决问题过程就是学习的过程,其实就是一句话

    通过思考发现问题,并解决问题就是学习的过程! 这可能也适用于任何一门新技术。大家可以给我留言啊,一起交流,今天就到这里了,希望能对你有所帮助,下次见。

  • 相关阅读:
    元素的高度自适应
    关于IE6的一些常见的CSS BUG处理
    Vue项目在IE浏览器报错polyfilleventsource added missing EventSource to window
    Springboot使用JdbcTemplate RowMapper查询,直接返回实体列表
    Springboot启动工程后,浏览器出现输入用户名和密码
    mysql5.6 zip版本如何安装
    python基础基础知识介绍
    python基础数据类型,集合及深浅copy
    格式化输出
    python基础windows环境下 安装python2和python3
  • 原文地址:https://www.cnblogs.com/crith/p/7280237.html
Copyright © 2020-2023  润新知