├── demo04 ├── main.js ├── app.css ├── index.html ├── webpack.config.js └── bundle.js ├── splitChunks ├── .gitignore ├── src │ ├── c.js │ ├── index.js │ ├── locallib.js │ ├── b.js │ └── a.js ├── README.md ├── public │ ├── index.html │ └── index2.html ├── dist │ ├── index2.html │ ├── index.html │ ├── locallib.js │ └── index.js ├── package.json ├── webpack.config.js └── package-lock.json ├── demo01 ├── main.js ├── index.html ├── webpack.config.js ├── readme.md └── bundle.js ├── demo02 ├── main1.js ├── main2.js ├── index.html ├── webpack.config.js ├── bundle1.js └── bundle2.js ├── demo06 ├── css │ └── app.css ├── img │ ├── big.png │ └── small.png ├── index.html ├── webpack.config.js ├── js │ └── main.js ├── test │ └── 1.html └── dist │ └── bundle.js └── demo05 ├── big.png ├── small.png ├── index.html ├── 4853ca667a2b8b8844eb2693ac1b2578.png ├── main.js ├── webpack.config.js └── bundle.js /demo04/main.js: -------------------------------------------------------------------------------- 1 | require('./app.css'); 2 | -------------------------------------------------------------------------------- /splitChunks/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | -------------------------------------------------------------------------------- /demo01/main.js: -------------------------------------------------------------------------------- 1 | document.write('

你好

'); 2 | -------------------------------------------------------------------------------- /demo02/main1.js: -------------------------------------------------------------------------------- 1 | document.write('

Hello World

'); 2 | -------------------------------------------------------------------------------- /demo02/main2.js: -------------------------------------------------------------------------------- 1 | document.write('

Hello Webpack

'); 2 | -------------------------------------------------------------------------------- /demo04/app.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: blue; 3 | } 4 | -------------------------------------------------------------------------------- /demo06/css/app.css: -------------------------------------------------------------------------------- 1 | body { 2 | background-color: blue; 3 | } 4 | -------------------------------------------------------------------------------- /demo05/big.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Wscats/webpack/HEAD/demo05/big.png -------------------------------------------------------------------------------- /demo05/small.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Wscats/webpack/HEAD/demo05/small.png -------------------------------------------------------------------------------- /demo06/img/big.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Wscats/webpack/HEAD/demo06/img/big.png -------------------------------------------------------------------------------- /demo06/img/small.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Wscats/webpack/HEAD/demo06/img/small.png -------------------------------------------------------------------------------- /splitChunks/src/c.js: -------------------------------------------------------------------------------- 1 | function fn() { 2 | console.log('c-------'); 3 | } 4 | 5 | module.exports = fn(); -------------------------------------------------------------------------------- /demo01/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /demo05/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /demo01/webpack.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | entry: './main.js', 3 | output: { 4 | filename: 'bundle.js' 5 | } 6 | }; 7 | -------------------------------------------------------------------------------- /demo05/4853ca667a2b8b8844eb2693ac1b2578.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/Wscats/webpack/HEAD/demo05/4853ca667a2b8b8844eb2693ac1b2578.png -------------------------------------------------------------------------------- /demo06/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /splitChunks/README.md: -------------------------------------------------------------------------------- 1 | ### webpack-optimize-demo 源码 2 | 文章地址: 3 | [webpack优化之玩转代码分割和公共代码提取](https://juejin.im/post/5dd4d73de51d4541700603e3) -------------------------------------------------------------------------------- /demo02/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /splitChunks/src/index.js: -------------------------------------------------------------------------------- 1 | import a from './a.js'; 2 | import b from './b.js'; 3 | 4 | function fn() { 5 | console.log('index-------'); 6 | } 7 | 8 | fn(); -------------------------------------------------------------------------------- /splitChunks/src/locallib.js: -------------------------------------------------------------------------------- 1 | console.log('locallib') 2 | module.exports = { 3 | info: () => { 4 | console.log('This is my project lib') 5 | } 6 | } -------------------------------------------------------------------------------- /splitChunks/src/b.js: -------------------------------------------------------------------------------- 1 | require('./c.js'); 2 | const $ = require('jquery') 3 | 4 | function fn() { 5 | console.log('b-------'); 6 | } 7 | 8 | module.exports = fn(); -------------------------------------------------------------------------------- /demo01/readme.md: -------------------------------------------------------------------------------- 1 | # webpack.config.js 2 | 3 | ```js 4 | module.exports = { 5 | entry: './main.js', 6 | output: { 7 | filename: 'bundle.js' 8 | } 9 | }; 10 | ``` 11 | -------------------------------------------------------------------------------- /demo04/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 |

Hello World

7 | 8 | 9 | -------------------------------------------------------------------------------- /demo02/webpack.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | entry: { 3 | bundle1: './main1.js', 4 | bundle2: './main2.js' 5 | }, 6 | output: { 7 | filename: '[name].js' 8 | } 9 | }; 10 | -------------------------------------------------------------------------------- /demo05/main.js: -------------------------------------------------------------------------------- 1 | var img1 = document.createElement("img"); 2 | img1.src = require("./small.png"); 3 | document.body.appendChild(img1); 4 | 5 | var img2 = document.createElement("img"); 6 | img2.src = require("./big.png"); 7 | document.body.appendChild(img2); 8 | -------------------------------------------------------------------------------- /demo04/webpack.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | entry: './main.js', 3 | output: { 4 | filename: 'bundle.js' 5 | }, 6 | module: { 7 | loaders:[ 8 | { test: /\.css$/, loader: 'style-loader!css-loader' }, 9 | ] 10 | } 11 | }; 12 | -------------------------------------------------------------------------------- /demo05/webpack.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | entry: './main.js', 3 | output: { 4 | filename: 'bundle.js' 5 | }, 6 | module: { 7 | loaders:[ 8 | { test: /\.(png|jpg)$/, loader: 'url-loader?limit=8192'} 9 | ] 10 | } 11 | }; 12 | -------------------------------------------------------------------------------- /demo06/webpack.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | entry: './js/main.js', 3 | output: { 4 | filename: './dist/bundle.js' 5 | }, 6 | module: { 7 | loaders:[ 8 | { test: /\.(png|jpg)$/, loader: 'url-loader?limit=8192'}, 9 | { test: /\.css$/, loader: 'style-loader!css-loader' }, 10 | ] 11 | } 12 | }; 13 | -------------------------------------------------------------------------------- /splitChunks/public/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /demo06/js/main.js: -------------------------------------------------------------------------------- 1 | var img1 = document.createElement("img"); 2 | img1.src = require("../img/small.png"); 3 | document.body.appendChild(img1); 4 | 5 | var img2 = document.createElement("img"); 6 | img2.src = require("../img/big.png"); 7 | document.body.appendChild(img2); 8 | document.write('

你好

'); 9 | require('../css/app.css'); 10 | -------------------------------------------------------------------------------- /splitChunks/public/index2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /splitChunks/dist/index2.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Document 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /splitChunks/dist/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | Document 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | -------------------------------------------------------------------------------- /splitChunks/src/a.js: -------------------------------------------------------------------------------- 1 | require('./c.js'); 2 | require('./locallib.js'); 3 | // const _ = require('lodash'); 4 | const $ = require('jquery'); 5 | 6 | console.log($('body')); 7 | 8 | // console.log('lodash', _) 9 | import('lodash') 10 | .then(({ default: _ }) => { 11 | console.log('lodash', _) 12 | 13 | return element; 14 | }) 15 | .catch((error) => 'An error occurred while loading the component'); 16 | function fn() { 17 | console.log('a-------'); 18 | } 19 | 20 | module.exports = fn(); -------------------------------------------------------------------------------- /demo06/test/1.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 19 | -------------------------------------------------------------------------------- /splitChunks/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "webpack-optimize-demo", 3 | "version": "1.0.0", 4 | "description": "webpack optimization.splitChunks tutorial", 5 | "main": "", 6 | "scripts": { 7 | "build": "webpack --mode=development" 8 | }, 9 | "repository": { 10 | "type": "git", 11 | "url": "git+https://github.com/yc111/webpack-optimize-demo.git" 12 | }, 13 | "author": "champyin", 14 | "license": "ISC", 15 | "bugs": { 16 | "url": "https://github.com/yc111/webpack-optimize-demo/issues" 17 | }, 18 | "homepage": "https://github.com/yc111/webpack-optimize-demo#readme", 19 | "devDependencies": { 20 | "jquery": "^3.4.1", 21 | "terser-webpack-plugin": "^5.3.1" 22 | }, 23 | "dependencies": { 24 | "html-webpack-plugin": "^5.5.0", 25 | "lodash": "^4.17.21", 26 | "webpack": "^5.70.0", 27 | "webpack-cli": "^4.9.2" 28 | } 29 | } 30 | -------------------------------------------------------------------------------- /splitChunks/dist/locallib.js: -------------------------------------------------------------------------------- 1 | /* 2 | * ATTENTION: The "eval" devtool has been used (maybe by default in mode: "development"). 3 | * This devtool is neither made for production nor for readable output files. 4 | * It uses "eval()" calls to create a separate source file in the browser devtools. 5 | * If you are trying to read the output file, select a different devtool (https://webpack.js.org/configuration/devtool/) 6 | * or disable the default devtool with "devtool: false". 7 | * If you are looking for production-ready output files, see mode: "production" (https://webpack.js.org/configuration/mode/). 8 | */ 9 | (self["webpackChunkwebpack_optimize_demo"] = self["webpackChunkwebpack_optimize_demo"] || []).push([["locallib"],{ 10 | 11 | /***/ "./src/locallib.js": 12 | /*!*************************!*\ 13 | !*** ./src/locallib.js ***! 14 | \*************************/ 15 | /***/ ((module) => { 16 | 17 | eval("console.log('locallib')\nmodule.exports = {\n info: () => {\n console.log('This is my project lib')\n }\n}\n\n//# sourceURL=webpack://webpack-optimize-demo/./src/locallib.js?"); 18 | 19 | /***/ }) 20 | 21 | }]); -------------------------------------------------------------------------------- /demo01/bundle.js: -------------------------------------------------------------------------------- 1 | /******/ (function(modules) { // webpackBootstrap 2 | /******/ // The module cache 3 | /******/ var installedModules = {}; 4 | 5 | /******/ // The require function 6 | /******/ function __webpack_require__(moduleId) { 7 | 8 | /******/ // Check if module is in cache 9 | /******/ if(installedModules[moduleId]) 10 | /******/ return installedModules[moduleId].exports; 11 | 12 | /******/ // Create a new module (and put it into the cache) 13 | /******/ var module = installedModules[moduleId] = { 14 | /******/ exports: {}, 15 | /******/ id: moduleId, 16 | /******/ loaded: false 17 | /******/ }; 18 | 19 | /******/ // Execute the module function 20 | /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); 21 | 22 | /******/ // Flag the module as loaded 23 | /******/ module.loaded = true; 24 | 25 | /******/ // Return the exports of the module 26 | /******/ return module.exports; 27 | /******/ } 28 | 29 | 30 | /******/ // expose the modules object (__webpack_modules__) 31 | /******/ __webpack_require__.m = modules; 32 | 33 | /******/ // expose the module cache 34 | /******/ __webpack_require__.c = installedModules; 35 | 36 | /******/ // __webpack_public_path__ 37 | /******/ __webpack_require__.p = ""; 38 | 39 | /******/ // Load entry module and return exports 40 | /******/ return __webpack_require__(0); 41 | /******/ }) 42 | /************************************************************************/ 43 | /******/ ([ 44 | /* 0 */ 45 | /***/ function(module, exports) { 46 | 47 | document.write('

你好

'); 48 | 49 | 50 | /***/ } 51 | /******/ ]); -------------------------------------------------------------------------------- /demo02/bundle1.js: -------------------------------------------------------------------------------- 1 | /******/ (function(modules) { // webpackBootstrap 2 | /******/ // The module cache 3 | /******/ var installedModules = {}; 4 | 5 | /******/ // The require function 6 | /******/ function __webpack_require__(moduleId) { 7 | 8 | /******/ // Check if module is in cache 9 | /******/ if(installedModules[moduleId]) 10 | /******/ return installedModules[moduleId].exports; 11 | 12 | /******/ // Create a new module (and put it into the cache) 13 | /******/ var module = installedModules[moduleId] = { 14 | /******/ exports: {}, 15 | /******/ id: moduleId, 16 | /******/ loaded: false 17 | /******/ }; 18 | 19 | /******/ // Execute the module function 20 | /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); 21 | 22 | /******/ // Flag the module as loaded 23 | /******/ module.loaded = true; 24 | 25 | /******/ // Return the exports of the module 26 | /******/ return module.exports; 27 | /******/ } 28 | 29 | 30 | /******/ // expose the modules object (__webpack_modules__) 31 | /******/ __webpack_require__.m = modules; 32 | 33 | /******/ // expose the module cache 34 | /******/ __webpack_require__.c = installedModules; 35 | 36 | /******/ // __webpack_public_path__ 37 | /******/ __webpack_require__.p = ""; 38 | 39 | /******/ // Load entry module and return exports 40 | /******/ return __webpack_require__(0); 41 | /******/ }) 42 | /************************************************************************/ 43 | /******/ ([ 44 | /* 0 */ 45 | /***/ function(module, exports) { 46 | 47 | document.write('

Hello World

'); 48 | 49 | 50 | /***/ } 51 | /******/ ]); -------------------------------------------------------------------------------- /demo02/bundle2.js: -------------------------------------------------------------------------------- 1 | /******/ (function(modules) { // webpackBootstrap 2 | /******/ // The module cache 3 | /******/ var installedModules = {}; 4 | 5 | /******/ // The require function 6 | /******/ function __webpack_require__(moduleId) { 7 | 8 | /******/ // Check if module is in cache 9 | /******/ if(installedModules[moduleId]) 10 | /******/ return installedModules[moduleId].exports; 11 | 12 | /******/ // Create a new module (and put it into the cache) 13 | /******/ var module = installedModules[moduleId] = { 14 | /******/ exports: {}, 15 | /******/ id: moduleId, 16 | /******/ loaded: false 17 | /******/ }; 18 | 19 | /******/ // Execute the module function 20 | /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); 21 | 22 | /******/ // Flag the module as loaded 23 | /******/ module.loaded = true; 24 | 25 | /******/ // Return the exports of the module 26 | /******/ return module.exports; 27 | /******/ } 28 | 29 | 30 | /******/ // expose the modules object (__webpack_modules__) 31 | /******/ __webpack_require__.m = modules; 32 | 33 | /******/ // expose the module cache 34 | /******/ __webpack_require__.c = installedModules; 35 | 36 | /******/ // __webpack_public_path__ 37 | /******/ __webpack_require__.p = ""; 38 | 39 | /******/ // Load entry module and return exports 40 | /******/ return __webpack_require__(0); 41 | /******/ }) 42 | /************************************************************************/ 43 | /******/ ([ 44 | /* 0 */ 45 | /***/ function(module, exports) { 46 | 47 | document.write('

Hello Webpack

'); 48 | 49 | 50 | /***/ } 51 | /******/ ]); -------------------------------------------------------------------------------- /splitChunks/webpack.config.js: -------------------------------------------------------------------------------- 1 | const path = require('path'); 2 | const HtmlWebpackPlugin = require('html-webpack-plugin'); 3 | const TerserPlugin = require("terser-webpack-plugin"); 4 | 5 | module.exports = { 6 | entry: { 7 | index: './src/index.js', 8 | index: './src/a.js' 9 | }, 10 | output: { 11 | path: path.resolve(__dirname, 'dist'), 12 | filename: '[name].js' 13 | }, 14 | optimization: { 15 | splitChunks: { 16 | minSize: 30, //提取出的chunk的最小大小 17 | cacheGroups: { 18 | default: { 19 | name: 'common', 20 | chunks: 'initial', 21 | minChunks: 2, //模块被引用2次以上的才抽离 22 | priority: -20 23 | }, 24 | vendors: { //拆分第三方库(通过npm|yarn安装的库) 25 | test: /[\\/]node_modules[\\/]/, 26 | name: 'vendor', 27 | chunks: 'initial', 28 | priority: -10 29 | }, 30 | locallib: { //拆分指定文件 31 | test: /(src\/locallib\.js)$/, 32 | name: 'locallib', 33 | chunks: 'initial', 34 | priority: -9 35 | } 36 | } 37 | } 38 | }, 39 | // optimization: { 40 | // chunkIds: "named", 41 | // moduleIds: 'hashed', 42 | // minimize: true, 43 | // minimizer: [ 44 | // new TerserPlugin({ 45 | // parallel: true, 46 | // // cache: true, 47 | // // sourceMap: true, 48 | // extractComments: false, 49 | // // 配置主要对齐 sheet 50 | // terserOptions: { 51 | // safari10: true, 52 | // parse: { 53 | // ecma: 8, 54 | // }, 55 | // mangle: { 56 | // safari10: true, 57 | // }, 58 | // compress: { 59 | // ecma: 5, 60 | // warnings: false, 61 | // comparisons: false, 62 | // inline: 2, 63 | // drop_console: true, 64 | // drop_debugger: true, 65 | // }, 66 | // output: { 67 | // ecma: 5, 68 | // comments: false, 69 | // ascii_only: true, 70 | // }, 71 | // }, 72 | // }) 73 | // ] 74 | // }, 75 | plugins: [ 76 | new HtmlWebpackPlugin({ 77 | template: './public/index.html', 78 | filename: 'index.html' 79 | }), 80 | new HtmlWebpackPlugin({ 81 | template: './public/index2.html', 82 | filename: 'index2.html' 83 | }) 84 | ] 85 | } -------------------------------------------------------------------------------- /demo05/bundle.js: -------------------------------------------------------------------------------- 1 | /******/ (function(modules) { // webpackBootstrap 2 | /******/ // The module cache 3 | /******/ var installedModules = {}; 4 | 5 | /******/ // The require function 6 | /******/ function __webpack_require__(moduleId) { 7 | 8 | /******/ // Check if module is in cache 9 | /******/ if(installedModules[moduleId]) 10 | /******/ return installedModules[moduleId].exports; 11 | 12 | /******/ // Create a new module (and put it into the cache) 13 | /******/ var module = installedModules[moduleId] = { 14 | /******/ exports: {}, 15 | /******/ id: moduleId, 16 | /******/ loaded: false 17 | /******/ }; 18 | 19 | /******/ // Execute the module function 20 | /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); 21 | 22 | /******/ // Flag the module as loaded 23 | /******/ module.loaded = true; 24 | 25 | /******/ // Return the exports of the module 26 | /******/ return module.exports; 27 | /******/ } 28 | 29 | 30 | /******/ // expose the modules object (__webpack_modules__) 31 | /******/ __webpack_require__.m = modules; 32 | 33 | /******/ // expose the module cache 34 | /******/ __webpack_require__.c = installedModules; 35 | 36 | /******/ // __webpack_public_path__ 37 | /******/ __webpack_require__.p = ""; 38 | 39 | /******/ // Load entry module and return exports 40 | /******/ return __webpack_require__(0); 41 | /******/ }) 42 | /************************************************************************/ 43 | /******/ ([ 44 | /* 0 */ 45 | /***/ function(module, exports, __webpack_require__) { 46 | 47 | var img1 = document.createElement("img"); 48 | img1.src = __webpack_require__(1); 49 | document.body.appendChild(img1); 50 | 51 | var img2 = document.createElement("img"); 52 | img2.src = __webpack_require__(2); 53 | document.body.appendChild(img2); 54 | 55 | 56 | /***/ }, 57 | /* 1 */ 58 | /***/ function(module, exports) { 59 | 60 | module.exports = "data:image/png;base64,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" 61 | 62 | /***/ }, 63 | /* 2 */ 64 | /***/ function(module, exports, __webpack_require__) { 65 | 66 | module.exports = __webpack_require__.p + "4853ca667a2b8b8844eb2693ac1b2578.png"; 67 | 68 | /***/ } 69 | /******/ ]); -------------------------------------------------------------------------------- /demo04/bundle.js: -------------------------------------------------------------------------------- 1 | /******/ (function(modules) { // webpackBootstrap 2 | /******/ // The module cache 3 | /******/ var installedModules = {}; 4 | 5 | /******/ // The require function 6 | /******/ function __webpack_require__(moduleId) { 7 | 8 | /******/ // Check if module is in cache 9 | /******/ if(installedModules[moduleId]) 10 | /******/ return installedModules[moduleId].exports; 11 | 12 | /******/ // Create a new module (and put it into the cache) 13 | /******/ var module = installedModules[moduleId] = { 14 | /******/ exports: {}, 15 | /******/ id: moduleId, 16 | /******/ loaded: false 17 | /******/ }; 18 | 19 | /******/ // Execute the module function 20 | /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); 21 | 22 | /******/ // Flag the module as loaded 23 | /******/ module.loaded = true; 24 | 25 | /******/ // Return the exports of the module 26 | /******/ return module.exports; 27 | /******/ } 28 | 29 | 30 | /******/ // expose the modules object (__webpack_modules__) 31 | /******/ __webpack_require__.m = modules; 32 | 33 | /******/ // expose the module cache 34 | /******/ __webpack_require__.c = installedModules; 35 | 36 | /******/ // __webpack_public_path__ 37 | /******/ __webpack_require__.p = ""; 38 | 39 | /******/ // Load entry module and return exports 40 | /******/ return __webpack_require__(0); 41 | /******/ }) 42 | /************************************************************************/ 43 | /******/ ([ 44 | /* 0 */ 45 | /***/ function(module, exports, __webpack_require__) { 46 | 47 | __webpack_require__(1); 48 | 49 | 50 | /***/ }, 51 | /* 1 */ 52 | /***/ function(module, exports, __webpack_require__) { 53 | 54 | // style-loader: Adds some css to the DOM by adding a