From 02b934c33d4b11795c8b9df321b34f59d691d116 Mon Sep 17 00:00:00 2001 From: tangjinzhou <415800467@qq.com> Date: Mon, 9 Aug 2021 21:49:57 +0800 Subject: [PATCH] chore: update webpack --- .gitignore | 2 + components/locale-provider/index.tsx | 13 +++-- components/pagination/Pagination.tsx | 1 + components/vc-mentions/src/Mentions.tsx | 2 +- package.json | 2 +- webpack.build.conf.js | 73 +++++++++++++++---------- 6 files changed, 56 insertions(+), 37 deletions(-) diff --git a/.gitignore b/.gitignore index 86ef043fe..b41f07728 100644 --- a/.gitignore +++ b/.gitignore @@ -73,3 +73,5 @@ site/dev.js # IDE 语法提示临时文件 vetur/ + +report.html diff --git a/components/locale-provider/index.tsx b/components/locale-provider/index.tsx index fd61dc534..374b4f805 100644 --- a/components/locale-provider/index.tsx +++ b/components/locale-provider/index.tsx @@ -8,16 +8,17 @@ import { withInstall } from '../_util/type'; import type { ValidateMessages } from '../form/interface'; import type { TransferLocale } from '../transfer'; import type { PickerLocale as DatePickerLocale } from '../date-picker/generatePicker'; +import { PaginationLocale } from '../pagination/Pagination'; interface TransferLocaleForEmpty { description: string; } export interface Locale { locale: string; - Pagination?: Object; - Table?: Object; - Popconfirm?: Object; - Upload?: Object; + Pagination?: PaginationLocale; + Table?: Record; + Popconfirm?: Record; + Upload?: Record; Form?: { optional?: string; defaultValidateMessages: ValidateMessages; @@ -72,9 +73,9 @@ const LocaleProvider = defineComponent({ () => props.locale, val => { state.antLocale = { - ...val, + ...props.locale, exist: true, - }; + } as any; changeConfirmLocale(val && val.Modal); }, { immediate: true }, diff --git a/components/pagination/Pagination.tsx b/components/pagination/Pagination.tsx index 5c5ce32ac..fe2e63ce5 100644 --- a/components/pagination/Pagination.tsx +++ b/components/pagination/Pagination.tsx @@ -51,6 +51,7 @@ export const paginationConfig = () => ({ export type PaginationProps = Partial>>; export type PaginationConfig = Partial>>; +export type PaginationLocale = any; export default defineComponent({ name: 'APagination', inheritAttrs: false, diff --git a/components/vc-mentions/src/Mentions.tsx b/components/vc-mentions/src/Mentions.tsx index 10e78387b..ec291fe67 100644 --- a/components/vc-mentions/src/Mentions.tsx +++ b/components/vc-mentions/src/Mentions.tsx @@ -212,7 +212,7 @@ export default defineComponent({ if (!!filterOption === false) { return true; } - return filterOption(targetMeasureText, option); + return (filterOption as Function)(targetMeasureText, option); }); return list; }; diff --git a/package.json b/package.json index 0ea8e6230..4cfbcf718 100644 --- a/package.json +++ b/package.json @@ -195,7 +195,7 @@ "vue-style-loader": "^4.1.2", "vuex": "^4.0.0-beta.2", "webpack": "^5.0.0", - "webpack-bundle-analyzer": "^4.0.0", + "webpack-bundle-analyzer": "^4.4.2", "webpack-cli": "^4.6.0", "webpack-dev-server": "^3.1.14", "webpack-merge": "^5.0.0", diff --git a/webpack.build.conf.js b/webpack.build.conf.js index 5d7078cad..c065f6b04 100644 --- a/webpack.build.conf.js +++ b/webpack.build.conf.js @@ -1,4 +1,5 @@ // This config is for building dist files +const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer'); const getWebpackConfig = require('./antd-tools/getWebpackConfig'); const IgnoreEmitPlugin = require('ignore-emit-webpack-plugin'); const darkVars = require('./scripts/dark-vars'); @@ -21,41 +22,55 @@ function externalDayjs(config) { }; } +function processWebpackThemeConfig(themeConfig, theme, vars) { + themeConfig.forEach(config => { + externalDayjs(config); + + // rename default entry to ${theme} entry + Object.keys(config.entry).forEach(entryName => { + config.entry[entryName.replace('antd', `antd.${theme}`)] = config.entry[entryName]; + delete config.entry[entryName]; + }); + + // apply ${theme} less variables + config.module.rules.forEach(rule => { + // filter less rule + if (rule.test instanceof RegExp && rule.test.test('.less')) { + const lessRule = rule.use[rule.use.length - 1]; + if (lessRule.options.lessOptions) { + lessRule.options.lessOptions.modifyVars = vars; + } else { + lessRule.options.modifyVars = vars; + } + } + }); + + const themeReg = new RegExp(`${theme}(.min)?\\.js(\\.map)?$`); + // ignore emit ${theme} entry js & js.map file + config.plugins.push(new IgnoreEmitPlugin(themeReg)); + }); +} + const webpackConfig = getWebpackConfig(false); +const webpackDarkConfig = getWebpackConfig(false); + if (process.env.RUN_ENV === 'PRODUCTION') { webpackConfig.forEach(config => { externalDayjs(config); addLocales(config); + // Reduce non-minified dist files size + config.optimization.usedExports = true; + + config.plugins.push( + new BundleAnalyzerPlugin({ + analyzerMode: 'static', + openAnalyzer: false, + reportFilename: '../report.html', + }), + ); }); + + processWebpackThemeConfig(webpackDarkConfig, 'dark', darkVars); } -const webpackDarkConfig = getWebpackConfig(false); - -webpackDarkConfig.forEach(config => { - externalDayjs(config); - - // rename default entry to ${theme} entry - Object.keys(config.entry).forEach(entryName => { - config.entry[entryName.replace('antd', `antd.dark`)] = config.entry[entryName]; - delete config.entry[entryName]; - }); - - // apply ${theme} less variables - config.module.rules.forEach(rule => { - // filter less rule - if (rule.test instanceof RegExp && rule.test.test('.less')) { - const lessRule = rule.use[rule.use.length - 1]; - if (lessRule.options.lessOptions) { - lessRule.options.lessOptions.modifyVars = darkVars; - } else { - lessRule.options.modifyVars = darkVars; - } - } - }); - - const themeReg = new RegExp(`dark(.min)?\\.js(\\.map)?`); - // ignore emit ${theme} entry js & js.map file - config.plugins.push(new IgnoreEmitPlugin(themeReg)); -}); - module.exports = webpackConfig.concat(webpackDarkConfig);