前端⾯试题记录--webpack打包
在⽣产环境中，webpack执⾏的时候build.js⽂件太⼤，每次请求都会消耗很⼤的流量，如果修改代码，代码不会更新，浏览器记录了缓存，如果同名⽂件不会发起请求，⾛缓存；php什么时候出现的
使⽤readfileSync读取package.json⽂件中的版本号，把获取的version（版本号）加⼊到output出⼝⽂件build.js中，以版本号管理升级的问题，版本⼀升级所有的资源，都直接重新来，浪费很多不必要的流量，如果⽂件发⽣改变那么从新请求index.html内的引⽤也要发⽣改变；
以chunkhash来解决缓存后修改代码的问题，在每个⽂件的处理中都可以获取其数字签名，⽂件内容发⽣改变，chunkhash也发⽣改
如何制作手机网页链接变，index,html中的chunkhash⽂件名也发⽣改名，产⽣系统升级，不⾛缓存；
如果更改css或者js或者第三⽅包，都会触发重新牺牲流量去请求新的build.js，使⽤webpack的插件extract-text-webpack-plugin，在插件中通过contenthash将css分离，css的更改和js的更改互不影响，只要发⽣改动就能绕过缓存完成升级；
如果修改js，会影响所有的js（⾥⾯的内容包括⾃⼰写的和第三⽅包），使⽤webpack插件CommonsChunkPlugin分离第三⽅库，把⾃⼰的js和第三⽅包分离，各⾛各的，第三⽅包⾛vendor；
matlab polyval
改动main.js代码会导致重新⽣成vendor，使⽤manifest记录到依赖清单，每次只要改动vorder或者main都会重新⽣成关联清单，vendor 不会被main.js所影响，main.js也不会被vendor所影响;
web前端基础面试题shodan查看摄像头假如不⾛缓存的话，那么vendor和main的⽂件还是特别⼤，使⽤webpack插件uglifyjs-webpack-plugin，来压缩js，因为⽤了ES6，所以使⽤yarn下载，压缩之后js⽂件就⼩了差不多50%;
当前效果⽐之前好了很多，但是还不是最完美的，在没有任何缓存的情况下，⽤户⼀进来主页访问消耗的流量还是很⼤，此时就需要⽤到按需加载组件，webpack分块打包，在路由router中提供了⼀个功能，懒加载，不要需要改变任何路由配置，把所有独⾃默认⼀开始就加载的组件分块打包（除了全局下的），形成⼀个个封装的函数，在路由匹配需要渲染的时候才获取组件对象，在页⾯创建script标签请求回来，引⼊执⾏….
留言板

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。