在umi.js 或者 umi.ts 或者 .umirc.js 或者 config.js 中配置,使用 webpack 的优化模块optimization.splitChunks实现。 chunks配置 chunks 配置需要加上 umi,否则打包完后依旧是白屏,在控制台可看到 umi.js 和 umi.css 并没有引入。 compression-webpack-plugin服务端使用gzip进行压缩 打开config/config.ts文件(...
umi打包的时候,居然用了30分钟。有必要进行压缩,经过优化后,从30分钟到4分钟。 具体方案 关键插件和umi版本: "umi":"^3.2.24","compression-webpack-plugin":"^6.0.0", 在.umirc.ts文件添加 exportdefaultdefineConfig({ nodeModulesTransform: { type:'none', exclude: [], }, ... dynamicImport: {}...
首先添加一个包"compression-webpack-plugin": "^6.1.1" 然后在配置里面进行设置 .umirc.ts import{defineConfig}from'umi';importroutesfrom'./config/routes';importproxyfrom'./config/proxy';constCompressionPlugin=require('compression-webpack-plugin');constproductionGzipExtensions=/\.(js|css|json|txt|ht...
"umi": "^3.2.24", "compression-webpack-plugin": "^6.0.0", 1. 2. 在.umirc.ts文件添加 export default defineConfig({ nodeModulesTransform: { type: 'none', exclude: [], }, ... dynamicImport: {}, chunks: ['vendors', 'umi'], chainWebpack: function (config, { webpack }) { ...
2. 使用webpack 的两个插件进行压缩: 安装第一个插件:使用插件去掉console $ npm i-Dbabel-plugin-transform-remove-console// 去掉console removeConsole.png 安装第二个插件: $ npm i-D compression-webpack-plugin// 使用Gzip 压缩生产包 1.png
"compression-webpack-plugin": "^6.0.0", 在.umirc.ts文件添加 exportdefaultdefineConfig({nodeModulesTransform:{type:'none',exclude:[],},...dynamicImport:{},chunks:['vendors','umi'],chainWebpack:function(config,{webpack}){config.merge({optimization:{splitChunks:{chunks:'all',automaticNameDeli...
"compression-webpack-plugin": "^6.0.0",在.umirc.ts⽂件添加 export default defineConfig({ nodeModulesTransform: { type: 'none',exclude: [],},...dynamicImport: {},chunks: ['vendors', 'umi'],chainWebpack: function (config, { webpack }) { config.merge({ optimization: { splitChunks...
如果需要查看 webpack 的配置,可以使用 // .umirc.tsexportdefault{chainWebpack:(config)=>{console.log('webpack Config',config.toConfig())returnconfig;}} 那怎么添加一个webpack插件配置呢? 这样添加webpack配置,比如 import CompressionPlugin from 'compression-webpack-plugin'; $.plugin('compression-web...
.umirc -> chainWebpack 添加 chunks 提取,事例代码如下 chunks: ['vendors', 'umi'], chainWebpack: function(config, { webpack }) { if (prod) { config.plugin('compression-webpack-plugin').use(CompressionPlugin, [ { test: /.js$|.html$|.css$/, //匹配文件名 th.
加入了打包进度条 webpackbar 加入了打包压缩 compression-webpack-plugin terser-webpack-plugin 还对包进行拆包 开发环境的域名代理 devServer 加快打包速度，还可以考虑删除antd-icons，单独去iconfont网站下，按需引入。不然打包会费很多时间 引入dotenv-cli 新增开发环境配置文件 .env.developm...