From 67a168b0363817190d72a389f5aa5c40c86085f1 Mon Sep 17 00:00:00 2001 From: Diablohu <Diablohu@users.noreply.github.com> Date: Fri, 20 Aug 2021 11:44:01 +0800 Subject: [PATCH] deps(webpack): update for WDS 4 --- CHANGELOG.md | 5 +- packages/koot-webpack/build.js | 2 +- packages/koot-webpack/building/client-dev.js | 62 +++++++++++++------- packages/koot-webpack/package.json | 6 +- packages/koot/package.json | 4 +- test/projects/simple/package.json | 8 +-- test/projects/simple2/package.json | 8 +-- test/projects/standard/package.json | 8 +-- test/projects/standard/src/critical.g.less | 6 +- 9 files changed, 66 insertions(+), 43 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 67e76d362..ce5c61fb0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -63,6 +63,7 @@ - 移除 _CSS_ 处理时的 `universal-alias-loader` 逻辑 - 新版 _Webpack_ 已默认支持 `css-loader` 使用 `resolve.alias` 配置,该 _Loader_ 不再需要 - 更新依赖包 **major** 版本号 + - `@pmmmwh/react-refresh-webpack-plugin` -> _^0.5.0-rc.4_ - `compression-webpack-plugin` -> _^8.0.1_ - `copy-webpack-plugin` -> _^9.0.1_ - `css-loader` -> _^6.2.0_ @@ -74,7 +75,7 @@ - `sass-loader` -> _^12.1.0_ - `style-loader` -> _^3.2.1_ - `thread-loader` -> _^3.0.4_ - - `webpack` -> _^5.48.0_ ([#215](https://github.com/cmux/koot/issues/215)) + - `webpack` -> _^5.51.1_ ([#215](https://github.com/cmux/koot/issues/215)) - `webpack-bundle-analyzer` -> _^4.4.2_ - `webpack-dev-middleware` -> _^5.0.0_ - `webpack-dev-server` -> _^4.0.0_ ([官方升级指南](https://github.com/webpack/webpack-dev-server/blob/master/migration-v4.md)) @@ -1885,7 +1886,7 @@ _Koot.js_ 0.14 开始原生支持 _Electron_ 项目开发。利用 `koot-cli` **2018-09-14** - **ReactApp** (React 同构) - - 当多语言(i18n)启用时,在 `<head>` 中自动生成跳转到相应的其他语种的链接的 `pageinfo`ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps<link>` 标签 + - 当多语言(i18n)启用时,在 `<head>` 中自动生成跳转到相应的其他语种的链接的 `pageinfo`ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps`pageinfo`` ImportStyle`Reacthttps`pageinfo ``ImportStyle`Reacthttps<link>` 标签 - 内部代码 - `hl` 修改为全局常量 diff --git a/packages/koot-webpack/build.js b/packages/koot-webpack/build.js index e66db5ece..a3cb56c01 100644 --- a/packages/koot-webpack/build.js +++ b/packages/koot-webpack/build.js @@ -531,7 +531,7 @@ module.exports = async (kootConfig = {}) => { if ( semver.satisfies( semver.coerce(getModuleVersion('webpack-dev-server')), - '>= 5' + '>= 4' ) ) { return await buildClientDev(buildParams); diff --git a/packages/koot-webpack/building/client-dev.js b/packages/koot-webpack/building/client-dev.js index 3ef7e1ade..be43971ff 100644 --- a/packages/koot-webpack/building/client-dev.js +++ b/packages/koot-webpack/building/client-dev.js @@ -9,7 +9,8 @@ const WebpackDevServer = require('webpack-dev-server'); const { keyConfigWebpackSPATemplateInject, } = require('koot/defaults/before-build'); -const getDistPath = require('koot/utils/get-dist-path'); +const getCwd = require('koot/utils/get-cwd'); +// const getDistPath = require('koot/utils/get-dist-path'); const buildClient = require('../build-client'); @@ -42,6 +43,36 @@ async function buildClientDev({ const configsSPATemplateInject = []; const configsClientDev = []; + const watchFiles = [ + 'template', + 'i18n', + 'routes', + 'store', + // 'staticCopyFrom', + ].reduce((list, key) => { + const value = appConfig[key]; + if (typeof value === 'undefined') return list; + + switch (key) { + case 'i18n': { + // console.log(key, value); + if (Array.isArray(value?.locales)) { + for (const [, , file] of value.locales) { + list.push(file); + } + } + break; + } + // case 'staticCopyFrom': { + // break; + // } + default: { + list.push(path.resolve(getCwd(), value)); + } + } + + return list; + }, []); if (Array.isArray(webpackConfig)) { webpackConfig.forEach((config) => { @@ -75,15 +106,16 @@ async function buildClientDev({ headers: optionHeaders = {}, devMiddleware: optionDevMiddleware = {}, client: optionClient = {}, - static: optionStatic = {}, - watchOptions: optionWatch, + watchFiles: optionWatchFiles, publicPath: v3_publicPath, stats: v3_stats, - watch: v3_watch, clientLogLevel: v3_clientLogLevel, quiet: v3_quiet, - contentBase: v3_contentBase, + + watch: IGNORED_v3_watch, + watchOptions: IGNORED_v3_watchOptions, + contentBase: IGNORED_v3_contentBase, // port, ...extendDevServerOptions @@ -137,21 +169,11 @@ async function buildClientDev({ ...optionClient, }, - static: { - directory: v3_contentBase ?? './', - // watch: true, - watch: optionWatch ?? - v3_watch ?? { - // aggregateTimeout: 20 * 1000, - ignored: [ - // /node_modules/, - // 'node_modules', - getDistPath(), - path.resolve(getDistPath(), '**/*'), - ].map((v) => v.replace(/\\/g, '/')), - }, - ...optionStatic, - }, + watchFiles: Array.isArray(optionWatchFiles) + ? [...watchFiles, ...optionWatchFiles] + : typeof optionWatchFiles === 'object' + ? { ...optionWatchFiles } + : [...watchFiles], onBeforeSetupMiddleware: (devServer) => { if (appType === 'ReactSPA' || appType === 'ReactElectronSPA') { diff --git a/packages/koot-webpack/package.json b/packages/koot-webpack/package.json index cf9eba868..39c7fb48b 100644 --- a/packages/koot-webpack/package.json +++ b/packages/koot-webpack/package.json @@ -40,7 +40,7 @@ "@babel/preset-react": "^7.14.5", "@babel/preset-typescript": "^7.15.0", "@babel/register": "^7.15.3", - "@pmmmwh/react-refresh-webpack-plugin": "^0.4.3", + "@pmmmwh/react-refresh-webpack-plugin": "^0.5.0-rc.4", "@types/webpack": "^5.28.0", "babel-loader": "^8.2.2", "cache-loader": "^4.1.0", @@ -61,11 +61,11 @@ "style-loader": "^3.2.1", "thread-loader": "^3.0.4", "universal-alias-loader": "^1.2.2", - "webpack": "^5.50.0", + "webpack": "^5.51.1", "webpack-bundle-analyzer": "^4.4.2", "webpack-config": "^7.5.0", "webpack-dev-middleware": "^5.0.0", - "webpack-dev-server": "^3.11.2", + "webpack-dev-server": "^4.0.0", "webpack-hot-middleware": "^2.25.0", "workbox-webpack-plugin": "^6.2.4" }, diff --git a/packages/koot/package.json b/packages/koot/package.json index 013c46eac..d71454d02 100644 --- a/packages/koot/package.json +++ b/packages/koot/package.json @@ -49,7 +49,7 @@ "@types/inquirer": "^7.3.3", "@types/lodash": "^4.14.172", "@types/node": "^16.6.2", - "@types/react": "^17.0.18", + "@types/react": "^17.0.19", "@types/react-dom": "^17.0.9", "@types/react-redux": "^7.1.18", "@types/react-router": "npm:@types/react-router@^3.0.25", @@ -91,7 +91,7 @@ "open": "^8.2.1", "ora": "^5.4.1", "os-locale": "^5.0.0", - "pm2": "^5.1.0", + "pm2": "^5.1.1", "portfinder": "^1.0.28", "react": "^17.0.2", "react-dom": "^17.0.2", diff --git a/test/projects/simple/package.json b/test/projects/simple/package.json index 6e9496590..01f2c9fc8 100644 --- a/test/projects/simple/package.json +++ b/test/projects/simple/package.json @@ -73,7 +73,7 @@ "@types/inquirer": "^7.3.3", "@types/lodash": "^4.14.172", "@types/node": "^16.6.2", - "@types/react": "^17.0.18", + "@types/react": "^17.0.19", "@types/react-dom": "^17.0.9", "@types/react-redux": "^7.1.18", "@types/react-router": "npm:@types/react-router@^3.0.25", @@ -114,7 +114,7 @@ "open": "^8.2.1", "ora": "^5.4.1", "os-locale": "^5.0.0", - "pm2": "^5.1.0", + "pm2": "^5.1.1", "portfinder": "^1.0.28", "react": "^17.0.2", "react-dom": "^17.0.2", @@ -149,7 +149,7 @@ "@babel/preset-react": "^7.14.5", "@babel/preset-typescript": "^7.15.0", "@babel/register": "^7.15.3", - "@pmmmwh/react-refresh-webpack-plugin": "^0.4.3", + "@pmmmwh/react-refresh-webpack-plugin": "^0.5.0-rc.4", "@types/webpack": "^5.28.0", "babel-loader": "^8.2.2", "cache-loader": "^4.1.0", @@ -170,7 +170,7 @@ "style-loader": "^3.2.1", "thread-loader": "^3.0.4", "universal-alias-loader": "^1.2.2", - "webpack": "^5.50.0", + "webpack": "^5.51.1", "webpack-bundle-analyzer": "^4.4.2", "webpack-config": "^7.5.0", "webpack-dev-middleware": "^5.0.0", diff --git a/test/projects/simple2/package.json b/test/projects/simple2/package.json index 34116e17e..fb1981535 100644 --- a/test/projects/simple2/package.json +++ b/test/projects/simple2/package.json @@ -72,7 +72,7 @@ "@types/inquirer": "^7.3.3", "@types/lodash": "^4.14.172", "@types/node": "^16.6.2", - "@types/react": "^17.0.18", + "@types/react": "^17.0.19", "@types/react-dom": "^17.0.9", "@types/react-redux": "^7.1.18", "@types/react-router": "npm:@types/react-router@^3.0.25", @@ -113,7 +113,7 @@ "open": "^8.2.1", "ora": "^5.4.1", "os-locale": "^5.0.0", - "pm2": "^5.1.0", + "pm2": "^5.1.1", "portfinder": "^1.0.28", "react": "^17.0.2", "react-dom": "^17.0.2", @@ -148,7 +148,7 @@ "@babel/preset-react": "^7.14.5", "@babel/preset-typescript": "^7.15.0", "@babel/register": "^7.15.3", - "@pmmmwh/react-refresh-webpack-plugin": "^0.4.3", + "@pmmmwh/react-refresh-webpack-plugin": "^0.5.0-rc.4", "@types/webpack": "^5.28.0", "babel-loader": "^8.2.2", "cache-loader": "^4.1.0", @@ -169,7 +169,7 @@ "style-loader": "^3.2.1", "thread-loader": "^3.0.4", "universal-alias-loader": "^1.2.2", - "webpack": "^5.50.0", + "webpack": "^5.51.1", "webpack-bundle-analyzer": "^4.4.2", "webpack-config": "^7.5.0", "webpack-dev-middleware": "^5.0.0", diff --git a/test/projects/standard/package.json b/test/projects/standard/package.json index 18c64ee33..9230ce15d 100644 --- a/test/projects/standard/package.json +++ b/test/projects/standard/package.json @@ -91,7 +91,7 @@ "@types/inquirer": "^7.3.3", "@types/lodash": "^4.14.172", "@types/node": "^16.6.2", - "@types/react": "^17.0.18", + "@types/react": "^17.0.19", "@types/react-dom": "^17.0.9", "@types/react-redux": "^7.1.18", "@types/react-router": "npm:@types/react-router@^3.0.25", @@ -132,7 +132,7 @@ "open": "^8.2.1", "ora": "^5.4.1", "os-locale": "^5.0.0", - "pm2": "^5.1.0", + "pm2": "^5.1.1", "portfinder": "^1.0.28", "react": "^17.0.2", "react-dom": "^17.0.2", @@ -167,7 +167,7 @@ "@babel/preset-react": "^7.14.5", "@babel/preset-typescript": "^7.15.0", "@babel/register": "^7.15.3", - "@pmmmwh/react-refresh-webpack-plugin": "^0.4.3", + "@pmmmwh/react-refresh-webpack-plugin": "^0.5.0-rc.4", "@types/webpack": "^5.28.0", "babel-loader": "^8.2.2", "cache-loader": "^4.1.0", @@ -188,7 +188,7 @@ "style-loader": "^3.2.1", "thread-loader": "^3.0.4", "universal-alias-loader": "^1.2.2", - "webpack": "^5.50.0", + "webpack": "^5.51.1", "webpack-bundle-analyzer": "^4.4.2", "webpack-config": "^7.5.0", "webpack-dev-middleware": "^5.0.0", diff --git a/test/projects/standard/src/critical.g.less b/test/projects/standard/src/critical.g.less index 95d3578a1..05c07aadf 100644 --- a/test/projects/standard/src/critical.g.less +++ b/test/projects/standard/src/critical.g.less @@ -9,8 +9,8 @@ transition-property: background-color, background-size, background-position, border-color, box-shadow, // color, - // fill, - opacity, + // fill, + opacity, outline, transform, filter; } @@ -100,7 +100,7 @@ a, transition-property: background-color, background-size, background-position, border-color, box-shadow, color, // fill, - opacity, + opacity, outline, transform, filter; .hover({color: @color-link-hover;}; {color: @color-link-active;});