摘要： 前言：我们开发中经常会遇见这样一个问题，每次webpack打包，都会重复的打包引入node_modules中的代码，都会极大的占用webpack打包的速度，我们可以这样的处理，将node_modules中这些不变的代码提前打包一次，因为node_modules中代码不会改变，所以以后直接把这个提前打 阅读全文

摘要： 当前安装webpack、webpack-cli时会报错，wepback-cli版本不兼容,将webpack-cli版本改为3.3.12就可以了 yarn remove webpack-cli yarn add webpack-cli@3.3.12 阅读全文

摘要： webpack在引入两个依赖的包时，可能需要使用shimming，意思是处理代码上的兼容 1、在main.js中引入jquery import $ from 'jquery' import append from './append' //下面的给页面添加元素文件 append() 2、append 阅读全文

摘要： 开始，按照我的webpack分模块文章配置好后(mini-css-extract-plugin不支持代码hmr热更新，所以只在生产模式进行配置)，开始下面的配置 yarn add mini-css-extract-plugin css-minimizer-webpack-plugin 配置css分离 阅读全文

摘要： react hooks中useState更新值后经常会出现值更新不及时的bug，可以使用以下思路解决 import React, { Component, useState } from 'react' import ReactDom, { render } from 'react-dom' con 阅读全文

摘要： 1、实现代码code splitting的好处 1-1、在项目中项目代码大小为1m，引入的模块为1m，总共大小为2m，都打包在main.js，初次请求项目大小为2m，如果改了项目代码中的一部分，由于都在main.js中，再次刷新，还是请求2m，请求缓慢。 1-2、使用code splitting后， 阅读全文

摘要： 1、安装项目需要使用的npm包 yarn add webpack-merge cross-env html-webpack-plugin clean-webpack-plugin babel-loader @babel/core //cross-env设置打包env 2、在项目根目录下新建build 阅读全文

摘要： 1、安装配置babel yarn add babel-loader @babel/core @babel/preset-env 2、webpack.config.js配置module module: { rules: [ { test: /\.js$/, exclude: /node_modules 阅读全文

摘要： 1、安装lodash yarn add lodash 2、使用es5实现函数柯里化 function add(a, b) { return function (c, d) { // console.log(a + b + c + d) return a + b + c + d } } let num 阅读全文

摘要： 1、安装 yarn add @babel/core @babel/polyfill @babel/preset-env babel-loader 2、项目根目录webpack.config.js中配置rules { test: /\.js$/, exclude: /node_modules/, lo 阅读全文