陈海云 (Magic)

Code HelperVSCode — Code Helper 佔用 CPU 資源問題解決

為了開啟前端職涯的新征程,在 2022 年末入手了一台 M1 版的 Mackbook Air,其實在購買前就已經事先爬過文看看是否會有前後端開發上的問題,因為新版本的 Air (M1, M2) 在機身上已經捨棄了風扇的功能,靠的是 Apple 自家晶片整合 macOS 來高效能來解決發熱問題,但在 VSCode 開發上還是讓我給遇到了 👀。 隨即上網查了一下相關討論,可參考此篇 github 討論串及以下附圖,的確在開發時,有個叫 Code Helper 的進程佔滿了 CPU 的執行,而該進程就是 VSCode 在執行的。 在解決過程中我嘗試移除所有的外掛,甚至將 auto save 關閉,關閉其他應用程式等,都無法解決該問題(心想不是吧才剛換台 Mac 就遇到坑…),後來找到一個討論說是把 VSCode Settings 的
2 min read
React + Vite 配置 .env 文件
React

React + Vite 配置 .env 文件

今天,我将使用 Vite 创建 React 应用程序,因为他在构建和运行 Web 应用程序以及初始化环境变量方面具有良好的性能。 首先创建项目: $ npm create vite@latest #或 $ yarn create vite #或 $ pnpm create vite 安装依赖项: $ cd my-project $ npm install #或 $ yarn #或 $ pnpm install 添加 .env 依赖: $ npm install dotenv #或 $ yarn add dotenv #或 $ pnpm install dotenv 在 my-project 的主目录中创建'
1 min read
CSS

使用 CSS 实现弹窗三角

最近在做一个网站的聊天客服的需求,当在产品详情页面时,对话框上方会自动显示当前产品,用户可以直接发送这个产品的信息给 AI,如下图所示: 这里,按钮上方有一个指向这个弹窗的三角,那么如何通过 CSS 来实现这个三角呢,下面请看代码: HTML 代码: <h1>New Popup with Wrapper</h1> <div class="popup arrow-top"> <div class="popup-wrapper"> <p>Popup/modal example</p> <div&
2 min read