Webpack custom plug-in writing

When writing a custom plug-in, you need to know that the webpack plug-in consists of the following: A JavaScript named function or JavaScript class.Define an apply method on the prototype of the plug-in function.Specify an event hook bound to the webpack itself.Process specific data for webpack internal instances.Call the callback provided by ...

Posted by Smasher on Fri, 20 May 2022 00:03:21 +0300

How does webpack customize a loader?

In the development process of modern front-end, webpack is often used to package the code in a modular way. Usually, we directly use the configuration of webpack and the loader written by others. If you want to implement a loader, what do you need to do? 1. What is a loader? Webpack is a modular packaging tool based on node. It can only handle ...

Posted by sgoldenb on Wed, 18 May 2022 09:37:38 +0300

Explanation of implementation principle of Mini Pack

The article started on my blog https://github.com/mcuking/bl...Implementation source code, please refer to https://github.com/mcuking/bl... This paper mainly describes how to implement a front-end application packer similar to webpack step by step. The essence of webpack In essence, webpack is a static module bundler for modern JavaScript appli ...

Posted by ryanlwh on Sat, 14 May 2022 04:32:07 +0300

webpack - plugin development

Several necessary conditions for developing webpack plug-ins: Get compiler compiler Object, through which you can obtain information including config configuration, resource files, compilation information, hook functions, etc The life cycle function in the compilation stage, find the appropriate hook function to deal with the corresponding log ...

Posted by mtlhd on Thu, 12 May 2022 02:59:35 +0300

webpack re experience: Performance Optimization

preface We already know how to use webpack. Now let's talk about how to improve its performance. 1, HMR (module hot load) When we pack the file, we find that only modifying a small part of the content in one module will repackage the whole. Then if there are 10000 modules in our project, we only modify the content in one module. Ther ...

Posted by zhangy on Fri, 06 May 2022 10:18:56 +0300

Front end workflow

background When more than one person works on a project, it is always because the code style of everyone is not unified, and the style needs to be unified by means of document agreement. For example, the way of file naming, some people have uppercase initials and some people have lowercase initials. There are different styles in JS, TS and Vue. ...

Posted by X.Cyclop on Fri, 06 May 2022 03:43:34 +0300

Analysis of basic configuration of webpack

For webpack, you (front-end development) will encounter it in daily development. Output it through writing, summarize and learn the small knowledge points learned about front-end engineering, and form your own knowledge system concept webpack official website definition: Webpack is a static module bundler for modern JavaScript applications. Whe ...

Posted by Paulkirkewalker on Wed, 04 May 2022 10:58:44 +0300

18_webpack code separation

What is code separation Code Splitting is a very important feature of webpack s His main purpose is to separate the code into bundle s, and then we can load them on demand or in parallel For example, by default, all JS code (business code, third-party dependencies, showing unused modules) is loaded on the first pageThis will affect the loading ...

Posted by garyb_44 on Tue, 03 May 2022 00:06:08 +0300

WebpackLibrary and LibraryTarget details

brief introduction Output of webpack libraryTarget has many parameters, and each parameter will affect the final compiled file. In the following, the author will introduce the actual impact of libraryTarget on the source code in combination with the actual compiled files. preface The official document of webpack mainly divides libraryTarget ...

Posted by Tuck on Mon, 02 May 2022 15:33:30 +0300

2020 transcript: development idea and implementation of front-end scaffold

The biggest advantage of working in a small company is to do everything. The PC/ official account / applet, front desk, back desk, middle desk, react, vue and UI are all in contact. There is a constant demand for products, more and more projects, and there are still a few people. For the standardization of the front end, the requirements of eng ...

Posted by sw9 on Mon, 02 May 2022 13:36:24 +0300