周报@2023-03-09 @ Thu, Mar 9, 2023 5:00 PM
周报@2023-03-09 @ Fri, Mar 10, 2023 5:07 PM
Expand 55 lines ...
56
56
57
+ [gzip 默认不会操作 HTTP STATUS CODE 为 201 的响应](https://mailman.nginx.org/pipermail/nginx/2012-September/035338.html)
57
+ [gzip 默认不会操作 HTTP STATUS CODE 为 201 的响应](https://mailman.nginx.org/pipermail/nginx/2012-September/035338.html)
58
+ 还要注意设置 gzip_types 哦
58
+ 还要注意设置 gzip_types 哦
59
+
60
+
## 基于 micro-app 的微前端实践
61
+
62
+
micro-app 搭配 ant-design-pro 使用时,在React 版本够高的情况下,暂时只发现只有 @ant-design/icons 的样式污染问题,会强行插入一段 style 导致样式污染。如下一段例子简单解决了这个问题:
63
+
64
+
```tsx
65
+
/** @jsxRuntime classic */
66
+
/** @jsx jsxCustomEvent */
67
+
import { PageContainer } from '@ant-design/pro-layout';
68
+
import jsxCustomEvent from '@micro-zoe/micro-app/polyfill/jsx-custom-event';
69
+
import { useLocation } from '@umijs/max';
70
+
71
+
// @ts-ignore
72
+
window.jsxCustomEvent = jsxCustomEvent;
73
+
74
+
const Micro = () => {
75
+
  const { pathname } = useLocation();
76
+
77
+
  return (
78
+
    <PageContainer title={false}>
79
+
      <micro-app
80
+
        id="hui-agent"
81
+
        data={{
82
+
          pathname,
83
+
        }}
84
+
        keep-alive
85
+
        name="hui-agent"
86
+
        shadowDOM
87
+
        url="https://qaecm-hui-agent.intous.com"
88
+
        onMounted={() => {
89
+
          setTimeout(() => {
90
+
            const ele = document
91
+
              .getElementById('hui-agent')
92
+
              ?.shadowRoot?.querySelector('micro-app-head');
93
+
            if (ele) {
94
+
              const style = document.createElement('style');
95
+
              style.innerHTML = `
96
+
                    .ant-input-clear-icon {
97
+
                      color: rgba(0, 0, 0, 0.25);
98
+
                    }
99
+
              `;
100
+
              ele.appendChild(style);
101
+
            }
102
+
            // 随缘的一秒
103
+
          }, 1000);
104
+
        }}
105
+
      />
106
+
    </PageContainer>
107
+
  );
108
+
};
109
+
110
+
export default Micro;
111
+
```