分类：loader

2021
09-14

如何在webpack项目中调试loader插件

最近，在学习webpack使用时，发现webpack-replace-loader配置正则不起用，调试插件后才发现，search健值竟然不支持正则的写法，后有换成string-replace-loader插件，这个loader的search健值支持正则写法，问题得到解决。这里记录下loader的调试方法：首先需要准备node环境第一步：下载全局安装node-nightlynpminstall-g--save-devnode-nightly第二步：添加调试命令"node-nightly":"node-nightly--inspect-brk./node_modu... 继续阅读 >

2021
03-23

分享12个Webpack中常用的Loader(小结)

前言初衷：整理一些常用的loader分享给大家，方便知道在什么场景下该用什么loader。如果有大佬都懂悄悄左滑就行，不喜勿喷。适合人群：前端初级开发。style-loader用途：用于将css编译完成的样式，挂载到页面style标签上。需要注意loader执行顺序，style-loader放到第一位，因为loader都是从下往上执行，最后全部编译完成挂载到style上安装cnpmistyle-loader-D配置webpack.config.jsmodule.exports={module:{rules:[... 继续阅读 >

2020
11-10

Webpack的Loader和Plugin的区别

Loader用于对模块源码的转换，loader描述了webpack如何处理非javascript模块，并且在buld中引入这些依赖。loader可以将文件从不同的语言（如TypeScript）转换为JavaScript，或者将内联图像转换为dataURL。比如说：CSS-Loader，Style-Loader等。loader的使用很简单：在webpack.config.js中指定loader。module.rules可以指定多个loader，对项目中的各个loader有个全局概览。loader是运行在NodeJS中，可以用options对象进行配置。plu... 继续阅读 >

2020
10-18

如何编写一个 Webpack Loader的实现

前言在平时自己由零搭建项目时，虽然基础配置都比较熟悉，比如配置file-loader,url-loader,css-loader等，配置不难，但究竟是怎么起作用的呢，今天就来说说如何编写一个WebpackLoader。Loader作用按我自己的简单理解，loader通常指打包的方案，即按什么方式来处理打包，打包的时候它可以拿到模块源代码，经过特定loader的转换后返回新的结果。比如sass-loader可以把SCSS代码转换成CSS代码编写Loader保持功能单一... 继续阅读 >

2020
09-28

深入webpack打包原理及loader和plugin的实现

本文讨论的核心内容如下：webpack进行打包的基本原理如何自己实现一个loader和plugin注：本文使用的webpack版本是v4.43.0,webpack-cli版本是v3.3.11，node版本是v12.14.1，npm版本v6.13.4(如果你喜欢yarn也是可以的)，演示用的chrome浏览器版本81.0.4044.129（正式版本）（64位）1.webpack打包基本原理webpack的一个核心功能就是把我们写的模块化的代码，打包之后，生成可以在浏览器中运行的代码... 继续阅读 >

2020
09-24

基于Android-Skin-Loader实现换肤效果

skin-loader框架的换肤是通过插件化的形式替换资源文件，实现换肤效果。好处是可以在线更新皮肤换肤android-skin-loader源码Demo样例流程整个框架大概的流程是加载皮肤包，找到被标记的控件，通过自定义的Factory工程过滤掉其他控件，使用皮肤包中的资源文件更新被标记的ui。使用操作1、导入android-skin-loader框架包androidStudioFile->new->importModule选择android-skin-loader项目右键->openModuleSetting->app中加载... 继续阅读 >

2020
09-24

Spring FactoriesLoader机制实例详解

一、SpringFactoriesLoader介绍1.1SpringFactoriesLoader简介SpringFactoriesLoader工厂加载机制是Spring内部提供的一个约定俗成的加载方式，与javaspi类似，只需要在模块的META-INF/spring.factories文件中，以Properties类型(即key-value形式)配置，就可以将相应的实现类注入Spirng容器中。Properties类型格式：key：是全限定名(抽象类|接口)value：是实现，多个实现通过**逗号**进行分隔1.2SpringFactorie... 继续阅读 >