webpack
26篇文章 · 0订阅
  • 前端工程化===Webpack？No，我来告诉你什么是前端工程化！
    由于现在开发中，前端可以负责的范围越来越大，早已不是仅限制于网页。像 App、小程序、甚至桌面应用，都可以使用前端技术来开发。 所以原来通过前端写 Demo，后端套数据的模式早就无法支持现代多元化前端开发。 前端工程化就是在这个背景下成为了受人重视的技术，并且是目前前端开发必备…
    Webpack 前端工程化
    前端工程化===Webpack？No，我来告诉你什么是前端工程化！
  • 『Webpack系列』—— loader配置详解
    从语法角度看，loader是一个普通的Node.js模块，只是必须以函数格式导出来供使用。如果有必要可以使用一切Node.js功能模块。 从功能角度看，loader是在Webpack中作用于指定格式的资源文件并将其按照一定格式转换输出。例如：less-loader将less文件…
    Webpack
    『Webpack系列』—— loader配置详解
  • webpack+Vue实现轮播图
    本来如果只是想做个轮播图的话不太需要这么麻烦的构建webpack项目，但是我的目的不是只做个轮播图这么简单，主要是想用webpack搭建一个vue项目，然后在里面实现了一个轮播图组件。在这个框架的基础上还可以实现很多其他的功能，大家可以下载源码自己往里面加东西。这里我提供本项目…
    Vue.js
  • 写了这么多webpack配置，不想做一个自己的打包工具吗
    总所周知，现代前端，基本都离不开前端工程化，多多少少都要用上打包工具进行处理，例如webpack、rollup。不过写得再多，也只是针对webpack/rollup的配置工程师，具体打包过程，对我们来说却是个黑盒。 在构建之前我们要梳理一下打包的流程。 因为第一个分析的模块一定…
    Webpack
  • webpack3.x升级4.x之后打包速度优化
    上一篇我们讲到，webpack3.x 升级 4.x 后打包大小优化，今天讲一下 webpack 4.x（webpack 4.43.0） 的打包速度优化，其实在升级了 webpack4 之后对于打包速度就已经有了很大的提升，但是查找时间（缩小范围）、loader 处理时间（多进程…
    Webpack
  • webpack4 搭建企业级脚手架
    eval模式，构建速度很快，可以得到错误在源代码中的行列，但是无法查看具体的行列信息， 因为它无法查看源代码，只能查看转换后的代码。 cheap-module-eval-source-map 和 cheap-eval-source-map 类似，但是是loader转换之前的源文…
    Webpack
  • webpack学习记录（二）
    1. Module module 是用来配置处理模块的规则，有以下三个主要部分。 同 noParse 配置项的区别在于，parser可以精确到语法层面,可以更细粒度地配置哪些模块语法被解析、哪些不被解析，而 noParse 只能控制哪些文件不被解析。 2. Resolve Re…
    Webpack
    webpack学习记录（二）
  • webpack+vue+koa开发博客指南
    此项目步骤很详细，任何人只要按着步骤来百分百能复现。 博客采用前后端分离，前端用vue+ts+stylus开发，基于MVVM模式；后端用koa2+mysql+sequelize ORM开发，基于MVC模式。前后端由webpack进行合体，并且对webpack进行了生产模式、开发…
    Node.js
    webpack+vue+koa开发博客指南
  • 『Webpack系列』—— externals用法详解
    如果小伙伴有做过首屏加载时间优化，应该会遇到chunk-vendors.js这个文件，巨大无比，加载时间超长，是首屏加载时间过长的罪魁祸首之一。 下面通过一个实际的项目来演示，先通过插件webpack-bundle-analyzer来可视化地查看chunk-vendors.js…
    Webpack Vue.js
    『Webpack系列』—— externals用法详解
  • webpack3.x升级4.x之后打包大小优化
    上一篇我们讲到，webpack3.x 升级 4.x 时遇到的问题、原因和解决方案，今天讲一下 webpack 4.x 的打包优化。 能够看到有好几个文件比较大，但是并不清楚具体包含哪些模块，哪些模块适合单独提取，哪些模块不适合提取，这个时候就需要用到打包分析的工具。 这里我们使…
    Webpack