@xfe-repo/web-app 1.6.1 → 1.6.3

package/README.md

@@ -1,3 +1,7 @@
 # `@xfe-repo/web-app`
 
 web框架基础库
+
+构建会先加载 `react-app-polyfill/stable`，并在应用原有 browserslist 的基础上，补充 Edge 18、Chrome 64、Firefox 60、Safari/iOS 12 及以上的 JS 编译目标，业务代码和第三方依赖使用同一目标。
+
+这是 JS 兼容基线；具体组件样式和浏览器 Web API 仍需在目标浏览器验证。

package/config/webpack/webpack.config.js

@@ -88,6 +88,16 @@ module.exports = function (webpackEnv) {
   const isEnvDevelopment = webpackEnv === 'development'
   const isEnvProduction = webpackEnv === 'production'
 
+  // 保留应用声明的目标，补充不随市场占有率淘汰的旧浏览器基线。
+  const browserTargets = [
+    ...require('browserslist')(undefined, { path: paths.appPath, env: process.env.BROWSERSLIST_ENV || webpackEnv }),
+    'edge >= 18',
+    'chrome >= 64',
+    'firefox >= 60',
+    'safari >= 12',
+    'ios_saf >= 12',
+  ]
+
   // Variable used for enabling profiling in Production
   // passed into alias object. Uses a flag if passed into the build command
   const isEnvProductionProfile = isEnvProduction && process.argv.includes('--profile')
@@ -185,7 +195,7 @@ module.exports = function (webpackEnv) {
   }
 
   return {
-    target: ['browserslist'],
+    target: `browserslist:${browserTargets.join(',')}`,
     // Webpack noise constrained to errors and warnings
     stats: 'errors-warnings',
     mode: isEnvProduction ? 'production' : isEnvDevelopment && 'development',
@@ -194,7 +204,7 @@ module.exports = function (webpackEnv) {
     devtool: isEnvProduction ? (shouldUseSourceMap ? 'source-map' : false) : isEnvDevelopment && 'cheap-module-source-map',
     // These are the "entry points" to our application.
     // This means they will be the "root" imports that are included in JS bundle.
-    entry: paths.appIndexJs,
+    entry: [require.resolve('react-app-polyfill/stable'), paths.appIndexJs],
     output: {
       // The build folder.
       path: paths.appBuild,
@@ -390,6 +400,7 @@ module.exports = function (webpackEnv) {
               include: paths.appSrc,
               loader: require.resolve('babel-loader'),
               options: {
+                targets: browserTargets,
                 customize: require.resolve('babel-preset-react-app/webpack-overrides'),
                 presets: [
                   [
@@ -418,9 +429,11 @@ module.exports = function (webpackEnv) {
             // Unlike the application JS, we only compile the standard ES features.
             {
               test: /\.(js|mjs)$/,
-              exclude: /@babel(?:\/|\\{1,2})runtime/,
+              // 保留完整 polyfill，避免 CRA 按 core-js 3.0 裁掉较新的运行时 API。
+              exclude: /@babel(?:\/|\\{1,2})runtime|core-js|react-app-polyfill/,
               loader: require.resolve('babel-loader'),
               options: {
+                targets: browserTargets,
                 babelrc: false,
                 configFile: false,
                 compact: false,

package/deploy/.drone.yml

@@ -138,6 +138,27 @@ steps:
         include:
           - refs/tags/release-*
 
+  - name: push-helm-chart
+    image: xhj-prod-registry-vpc.cn-hangzhou.cr.aliyuncs.com/xhj-image-common/deploy-helm:latest
+    environment:
+      USERNAME:
+        from_secret: username
+      PASSWORD:
+        from_secret: password
+    commands:
+      - chartName="${DRONE_REPO//\//-}"
+      - chartVersion="0.0.0-$DRONE_TAG"
+      - cp deploy/helm/values.prod.yaml deploy/helm/values.yaml
+      - sed -i "s/deployment/$chartName/g" deploy/helm/Chart.yaml
+      - helm package deploy/helm --version "$chartVersion"
+      - set +x
+      - printf '%s' "$PASSWORD" | helm registry login xhj-prod-registry-vpc.cn-hangzhou.cr.aliyuncs.com --username "$USERNAME" --password-stdin
+      - helm push "$chartName-$chartVersion.tgz" oci://xhj-prod-registry-vpc.cn-hangzhou.cr.aliyuncs.com/xhj-image
+    when:
+      ref:
+        include:
+          - refs/tags/release-*
+
 volumes:
   - name: node-modules
     host:

package/deploy/nginx.conf

@@ -5,6 +5,13 @@ server {
   server_name -;
   root /code/www/deploy/webroot/app/current;
 
+  gzip on;
+  gzip_vary on;
+  gzip_proxied any;
+  gzip_comp_level 5;
+  gzip_min_length 1024;
+  gzip_types text/plain text/css text/javascript application/javascript application/json application/xml text/xml image/svg+xml;
+
   set $apiEnv test;
 
   if ( $host ~* ^(?<hostPrefix>[^.]+)?\.?(?<subDomain>.*?)\.?(?<domain>[^.]+)\.(?<ltd>[a-zA-Z]+)$ ) {
@@ -23,14 +30,24 @@ server {
   }
 
   location /check-update {
-    add_header Cache-control no-cache;
+    add_header Cache-Control no-cache always;
 
     try_files /release =404;
   }
 
-  # 兼容v2版本的静态资源
-  location /v2/static {
-    rewrite /v2(.*) $1 break;
+  # 仅带内容 hash 的资源使用长期缓存
+  location ~* "\.[0-9a-f]{8,}(\.chunk)?\.[^./]+$" {
+    rewrite ^/v[0-9]+(/(static|js|css)/.*)$ $1 break;
+    try_files $uri =404;
+
+    add_header 'Access-Control-Allow-Origin' '*';
+    add_header Cache-Control "public, max-age=31536000, immutable";
+  }
+
+  # 兼容 /v数字/ 前缀下的构建资源
+  location ~ ^/v[0-9]+/(static|js|css)/ {
+    rewrite ^/v[0-9]+(/.*)$ $1 break;
+    add_header Cache-Control no-cache always;
   }
 
   location / {
@@ -39,7 +56,7 @@ server {
     # 兼容微前端 允许跨域
     add_header 'Access-Control-Allow-Origin' '*';
 
-    add_header Cache-Control no-cache;
+    add_header Cache-Control no-cache always;
     add_header Set-Cookie "apiEnv=${apiEnv}; Max-Age=2626560; Path=/;";
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xfe-repo/web-app",
-  "version": "1.6.1",
+  "version": "1.6.3",
   "bin": {
     "xfe-web": "./bin/index.js"
   },
@@ -80,7 +80,7 @@
     "workbox-webpack-plugin": "^7.0.0",
     "yaml": "^2.3.4",
     "@xfe-repo/eslint-config": "1.6.0",
-    "@xfe-repo/typescript-config": "1.6.1"
+    "@xfe-repo/typescript-config": "1.6.2"
   },
   "peerDependencies": {
     "react": "18.2.0",