webpack
6篇文章 · 0订阅
  • 「一劳永逸」由浅入深配置webpack4
    webpack在前端化过程中十分重要，所以花了一段时间学习webpack，以及webpack4新特性，本文是按照从易到难的过程，梳理部分webpack概念，常见的loader，plugins，webpack4新特新，还有部分高级概念。 Output: 如何命名输出文件，以及输出…
    Webpack JavaScript
    「一劳永逸」由浅入深配置webpack4
  • webpack4自定义脚手架构建优化
    脚手架是在原有的基础上构建的，所以基本的目录结构相类似。不过加上了对JS压缩，CSS代码压缩(tree shake)，引入了dllPlugin打包不常变动的类库生成动态链接库，加入happypack开启多进程打包，加快构建的速度，下面也会说到运用npm script，通过sft…
    Webpack
    webpack4自定义脚手架构建优化
  • 源码篇（三）：手写webpack版mini源码分析项目构建过程。附送简版webpack源码
    本文适合2~4年的前端开发人员的进阶，且对vue或者react搭配webpack有一定的经验。如果webpack的基本使用都未了解，建议实践后再看本文。 本文是原创，均为本人手写。部分思维, 借鉴了“宫小白”的webpack文章。文章结尾标注了“感谢”。 此前有人关心博客源码的…
    Webpack
  • 手写webpack核心原理，再也不怕面试官问我webpack原理
    需要读到入口文件里面的内容。 分析入口文件，递归的去读取模块所依赖的文件内容，生成AST语法树。 我们创建了add.js文件和minus.js文件,然后 在index.js中引入，再将index.js文件引入index.html。 现在我们打开index.html。你猜会发生什…
    Webpack
  • import、require、export、module.exports 混合使用详解
    自从使用了 es6 的模块系统后，各种地方愉快地使用 import export default，但也会在老项目中看到使用commonjs规范的 require module.exports。甚至有时候也会常常看到两者互用的场景。使用没有问题，但其中的关联与区别不得其解，使用起…
    前端 NPM Webpack
  • Webpack Tree shaking 深入探究
    App往往有一个入口文件，相当于一棵树的主干，入口文件有很多依赖的模块，相当于树枝。实际情况中，虽然依赖了某个模块，但其实只使用其中的某些功能。通过Tree shaking，将没有使用的模块摇掉，这样来达到删除无用代码的目的。 关于Tree shaking的原理，在Tree S…
    Webpack Babel 前端