I met

  • webpackthroughentriesandoutputConfigure entry and exit to build single-page/multi-page applications;
  • throughloaderTo convert multiple languages towebpackCan be compiledJS;
  • throughpluginsTo extend optimized packaging capabilities;
  • The final output is zerobundle,assetAnd whatever else you pack or usewebpackAny content loaded; The resource address can be accessed online through project configuration and CI deployment.

Project Configuration:

CI/OSS deployment:



Online access:

  • You can see things like:vendor,commom,manifestFiles, these are the final file products of webPack compilation package, whichmanifestCalled “file list”, records the detailed points of all modules for run-time query retrieval;

Configure a preliminary

loaders

“Pre-loading module”;

Module. rules;

Support chain transfer in reverse order;

plugins

A JS object with the apply attribute;

Plugins option;

To optimize the

The VUE project can be passed

npm run build --report=true
Copy the code

Call the webpack-bundle-Analyzer plug-in to view the analysis package resources

related

Webpack-dev-server: development environment startup service;

Webpack-merge: merge configuration objects;

Compiler instance: When the packaging process is customized in the production environment, the Webpack function returns the Compiler instance, whose run method triggers all compilation work and watch method triggers the executor.

** Webpack-bundle-Analyzer ** : View-analyze dependency graphs for packaged resources;

Copy-webpack-plugin: copies a single file or entire directory to the build directory;

Html-webpack-plugin: simply create HTML files for server access;