From 6f4788affc5c7dc484ea5aef165698bc62760653 Mon Sep 17 00:00:00 2001 From: master1lan <278457198@qq.com> Date: Sun, 19 Feb 2023 16:58:27 +0800 Subject: [PATCH 1/7] =?UTF-8?q?:bug:=20fix(custom):=20=E4=BF=AE=E5=A4=8D?= =?UTF-8?q?=E7=94=9F=E4=BA=A7=E7=8E=AF=E5=A2=83=E4=B8=8Bclarity=E6=9C=AA?= =?UTF-8?q?=E7=94=9F=E6=95=88=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- config/vite.master.config.ts | 4 ++-- package.json | 6 +++--- 2 files changed, 5 insertions(+), 5 deletions(-) diff --git a/config/vite.master.config.ts b/config/vite.master.config.ts index a9fbbe8..a6c0d17 100644 --- a/config/vite.master.config.ts +++ b/config/vite.master.config.ts @@ -37,7 +37,6 @@ import vitedevConfig from "./vite.dev.config"; // https://vitejs.dev/config/ //@ts-ignore export default mergeConfig( - vitedevConfig, defineConfig({ define: { isdev: false, @@ -101,5 +100,6 @@ export default mergeConfig( }, }, }, - }) + }), + vitedevConfig ); diff --git a/package.json b/package.json index 5788496..d71af44 100644 --- a/package.json +++ b/package.json @@ -5,10 +5,10 @@ "scripts": { "dev": "vite --config ./config/vite.dev.config.ts", "build": "tsc && vite build --config ./config/vite.master.config.ts && node build.js", - "preview": "vite preview", - "commit": "cz", "build:release": "vite build --config ./config/vite.release.config.ts && node build.js", - "release:changelog": "standard-version --preset gitmoji-config" + "release:changelog": "standard-version --preset gitmoji-config", + "preview": "vite preview", + "commit": "cz" }, "config": { "commitizen": { From 26f8a264a35ddcd02a49d3b2789d9fc13241cb30 Mon Sep 17 00:00:00 2001 From: master1lan <278457198@qq.com> Date: Sun, 19 Feb 2023 17:11:00 +0800 Subject: [PATCH 2/7] =?UTF-8?q?:bug:=20fix(custom):=20=E4=BF=AE=E5=A4=8D?= =?UTF-8?q?=E6=9F=A5=E7=9C=8B=E5=9B=BE=E7=89=87=E9=A1=B5=E9=9D=A2=E9=97=AA?= =?UTF-8?q?=E5=8A=A8=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 当点击图片时，滚动条会被隐藏导致整体页面重拍；现在已经修复 --- src/routers/photo/item/modal.tsx | 2 + src/utils/dom/index.ts | 71 ++++++++++++++++++++++++++++++++ src/utils/hooks/match.ts | 17 ++++++++ 3 files changed, 90 insertions(+) create mode 100644 src/utils/dom/index.ts diff --git a/src/routers/photo/item/modal.tsx b/src/routers/photo/item/modal.tsx index abc3f09..ac12fef 100644 --- a/src/routers/photo/item/modal.tsx +++ b/src/routers/photo/item/modal.tsx @@ -3,6 +3,7 @@ import { PhotoSlider } from "react-photo-view"; import "react-photo-view/dist/react-photo-view.css"; import { useEffect } from "react"; import { useLocation } from "react-router-dom"; +import { useBodyScrollHide } from "@utils/hooks/match"; type ModalType = { images: basicImageType[]; open: boolean; @@ -29,6 +30,7 @@ export default function ImgModals(props: ModalType) { }; } }, [open]); + useBodyScrollHide(open); return ( ({ src: item.src, key: index }))} diff --git a/src/utils/dom/index.ts b/src/utils/dom/index.ts new file mode 100644 index 0000000..286c412 --- /dev/null +++ b/src/utils/dom/index.ts @@ -0,0 +1,71 @@ +/** + * 给元素style添加属性。 + */ +export const ObjectToHtmlStyle = ( + obj: React.CSSProperties, + ele: HTMLElement +) => { + Object.entries(obj).forEach(([key, value]) => { + if (value) { + //@ts-ignore + ele.style[key] = value; + } + }); +}; + +let _ScrollBarWidthCached: number | null = null; + +function hasScrollbar(): boolean { + return ( + document.body.scrollHeight > + (window.innerHeight || document.documentElement.clientHeight) + ); +} +export function getScrollBarSize(): number { + if (!hasScrollbar()) { + _ScrollBarWidthCached = 0; + } + if (typeof _ScrollBarWidthCached === "number") { + return _ScrollBarWidthCached; + } + const inner = document.createElement("div"); + ObjectToHtmlStyle( + { + width: "100%", + height: "200px", + }, + inner + ); + const outer = document.createElement("div"); + ObjectToHtmlStyle( + { + position: "absolute", + top: "0", + left: "0", + pointerEvents: "none", + visibility: "hidden", + width: "200px", + height: "150px", + overflow: "hidden", + }, + outer + ); + outer.appendChild(inner); + document.body.appendChild(outer); + const widthContained = inner.offsetWidth; + ObjectToHtmlStyle( + { + overflow: "scroll", + }, + outer + ); + let widthScroll = inner.offsetWidth; + + if (widthContained === widthScroll) { + widthScroll = outer.clientWidth; + } + + document.body.removeChild(outer); + _ScrollBarWidthCached = widthContained - widthScroll; + return _ScrollBarWidthCached; +} diff --git a/src/utils/hooks/match.ts b/src/utils/hooks/match.ts index aade130..252268d 100644 --- a/src/utils/hooks/match.ts +++ b/src/utils/hooks/match.ts @@ -1,4 +1,6 @@ import { Breakpoint, useMediaQuery, useTheme } from "@mui/material"; +import { getScrollBarSize } from "@utils/dom"; +import { useEffect } from "react"; /** * @description 获知当前屏幕处于哪种大小 @@ -16,3 +18,18 @@ export const useScreenMatchSize = (size: Breakpoint) => { `@672w_378h_1c_!web-search-common-cover`; //首页up头像大小 `@96w_96h_1s.webp`; + +export const useBodyScrollHide = (hidden: boolean) => { + useEffect(() => { + const ScrollSize = getScrollBarSize(), + bodyStyle = document.body.style; + if (hidden) { + bodyStyle.overflow = "hidden"; + bodyStyle.paddingRight = `${ScrollSize}px`; + } + return () => { + bodyStyle.overflow = ""; + bodyStyle.paddingRight = ""; + }; + }, [hidden]); +}; From 93497123e62a8591b1c94d6b05964d12cee1fb93 Mon Sep 17 00:00:00 2001 From: master1lan <278457198@qq.com> Date: Sun, 19 Feb 2023 18:03:41 +0800 Subject: [PATCH 3/7] =?UTF-8?q?:zap:=20feat(custom):=20=E5=9B=BE=E7=89=87?= =?UTF-8?q?=E8=AF=A6=E6=83=85=E6=B7=BB=E5=8A=A0=E8=B7=B3=E8=BD=AC=E5=88=B0?= =?UTF-8?q?=E5=8A=A8=E6=80=81=E9=A1=B5=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/routers/photo/item/index.tsx | 2 +- src/routers/photo/item/modal.tsx | 21 ++++++++++++++++++++- src/routers/photo/item/photo.module.less | 11 +++++++++++ 3 files changed, 32 insertions(+), 2 deletions(-) diff --git a/src/routers/photo/item/index.tsx b/src/routers/photo/item/index.tsx index d535e40..b507919 100644 --- a/src/routers/photo/item/index.tsx +++ b/src/routers/photo/item/index.tsx @@ -15,7 +15,7 @@ export default function PhotoCard(props: CardType) { const { images, dynamic_id, ...resPorps } = props.data; const [open, set] = useState(false), handlerChangeOpen = () => set((open) => !open); - const modalPorps = { open, images, onClose: handlerChangeOpen }; + const modalPorps = { open, images, onClose: handlerChangeOpen, dynamic_id }; return (
void; + dynamic_id: number | string; }; export default function ImgModals(props: ModalType) { - const { open, onClose, images } = props; + const { open, onClose, images, dynamic_id } = props; const location = useLocation(); useEffect(() => { let flag = false; @@ -36,6 +40,21 @@ export default function ImgModals(props: ModalType) { images={images.map((item, index) => ({ src: item.src, key: index }))} visible={open} onClose={onClose} + toolbarRender={() => ( + + + 去对应动态 + + )} + // overlayRender={() => } /> ); } diff --git a/src/routers/photo/item/photo.module.less b/src/routers/photo/item/photo.module.less index 06a560e..eaddacc 100644 --- a/src/routers/photo/item/photo.module.less +++ b/src/routers/photo/item/photo.module.less @@ -5,4 +5,15 @@ .show-img { min-height: 150px; } +} + +:global { + .PhotoView-Slider__BannerRight { + flex: 1; + justify-content: end; + } + + .PhotoView-Slider__BannerWrap { + align-items: baseline; + } } \ No newline at end of file From bba1183b5fa8a62846ac3469fd52bd89383ff55b Mon Sep 17 00:00:00 2001 From: master1lan <278457198@qq.com> Date: Sun, 19 Feb 2023 18:04:07 +0800 Subject: [PATCH 4/7] chore(release): 0.1.0 --- CHANGELOG.md | 15 +++++++++++++++ package.json | 2 +- 2 files changed, 16 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index ed39bce..1e5285e 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,21 @@ All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines. +# [0.1.0](/compare/v0.0.3...v0.1.0) (2023-02-19) + + +### ✨ Features + +* **custom**: 图片详情添加跳转到动态页功能 9349712 + + +### 🐛 Bug Fixes + +* **custom**: 修复查看图片页面闪动问题 26f8a26 +* **custom**: 修复生产环境下clarity未生效问题 6f4788a + + + ## [0.0.3](/compare/v0.0.2...v0.0.3) (2023-02-19) diff --git a/package.json b/package.json index d71af44..1c405f3 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "eoefans-web", - "version": "0.0.3", + "version": "0.1.0", "type": "module", "scripts": { "dev": "vite --config ./config/vite.dev.config.ts", From 4d1a54e99cfac07ca75b53f5d8e22e02b99718c7 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?George=20Kazami=20=5B=E4=B9=94=E6=B2=BB=C2=B7=E9=A2=A8?= =?UTF-8?q?=E8=A6=8B=5D?= Date: Sun, 19 Feb 2023 11:01:32 +0000 Subject: [PATCH 5/7] Update dev-cloudflare-pages.yml --- .github/workflows/dev-cloudflare-pages.yml | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/.github/workflows/dev-cloudflare-pages.yml b/.github/workflows/dev-cloudflare-pages.yml index 544a544..1a5ccf1 100644 --- a/.github/workflows/dev-cloudflare-pages.yml +++ b/.github/workflows/dev-cloudflare-pages.yml @@ -71,8 +71,8 @@ jobs: run: pnpm install - name: Use pnpm to build - run: pnpm run build - + run: pnpm run build:release + # - name: post-build test # run: pnpm test From 80173f543d709e0f7d94b4c918f841e59e2b0490 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?George=20Kazami=20=5B=E4=B9=94=E6=B2=BB=C2=B7=E9=A2=A8?= =?UTF-8?q?=E8=A6=8B=5D?= Date: Sun, 19 Feb 2023 11:05:48 +0000 Subject: [PATCH 6/7] chore: revert clarity for dev env --- .github/workflows/dev-cloudflare-pages.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.github/workflows/dev-cloudflare-pages.yml b/.github/workflows/dev-cloudflare-pages.yml index 1a5ccf1..acc3a71 100644 --- a/.github/workflows/dev-cloudflare-pages.yml +++ b/.github/workflows/dev-cloudflare-pages.yml @@ -71,7 +71,7 @@ jobs: run: pnpm install - name: Use pnpm to build - run: pnpm run build:release + run: pnpm run build # - name: post-build test # run: pnpm test From ba34908777eb941c369448a9721d5179ef05648d Mon Sep 17 00:00:00 2001 From: master1lan <278457198@qq.com> Date: Sun, 19 Feb 2023 19:06:33 +0800 Subject: [PATCH 7/7] =?UTF-8?q?:bug:=20fix(custom):=20dev=E7=8E=AF?= =?UTF-8?q?=E5=A2=83=E4=B8=8B=E8=B7=AF=E5=BE=84=E9=97=AE=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ISSUES CLOSED: #19 --- config/vite.master.config.ts | 39 +++++++++++++++++++++--------------- 1 file changed, 23 insertions(+), 16 deletions(-) diff --git a/config/vite.master.config.ts b/config/vite.master.config.ts index a6c0d17..56938d5 100644 --- a/config/vite.master.config.ts +++ b/config/vite.master.config.ts @@ -1,4 +1,4 @@ -import { defineConfig } from "vite"; +import { defineConfig, UserConfigExport } from "vite"; // 可视化打包文件 import { visualizer } from "rollup-plugin-visualizer"; @@ -35,8 +35,28 @@ import { createHtmlPlugin } from "vite-plugin-html"; import { mergeConfig } from "vite"; import vitedevConfig from "./vite.dev.config"; // https://vitejs.dev/config/ -//@ts-ignore + +export const commonBuildConfig: UserConfigExport = mergeConfig( + defineConfig({ + plugins: [ + createHtmlPlugin({ + entry: "src/main.tsx", + template: "index.html", + inject: { + data: { + injectScript: ProdinjectScript, + }, + }, + }), + //@ts-ignore + getBulidTime(), + ], + }), + vitedevConfig +); + export default mergeConfig( + commonBuildConfig, defineConfig({ define: { isdev: false, @@ -49,19 +69,7 @@ export default mergeConfig( "iOS >= 9, Android >= 4.4, last 2 versions, > 0.2%, not dead", ], }), - { ...visualizer(), apply: "build" }, { ...viteCompression(), apply: "build" }, - createHtmlPlugin({ - entry: "src/main.tsx", - template: "index.html", - inject: { - data: { - injectScript: ProdinjectScript, - }, - }, - }), - //@ts-ignore - getBulidTime(), ], build: { sourcemap: true, @@ -100,6 +108,5 @@ export default mergeConfig( }, }, }, - }), - vitedevConfig + }) );