### 1. 安装 vite-plugin-html 插件, 并引入 ```javascript import { createHtmlPlugin } from 'vite-plugin-html' //... export default ({ mode }) => { //... plugins: [ createHtmlPlugin({ inject: { data: { } } }), //.... ], //... } //... ``` ### 2. 定义所需要的数据 ```javascript import path from 'node:path' // ... const vmDesignWidth = 3840 // 设计稿宽度 const vmDesignHeight = 1080 // 设计稿宽度 const minWindow = '1920Px' //...

@[toc] # nodejs ===框架=== https://github.com/expressjs/express `快速、无约束、极简的node web框架` ===其他=== https://github.com/cheeriojs/cheerio `为服务器特别定制的，快速、灵活、实施的jQuery核心实现` [[文档]](https://github.com/cheeriojs/cheerio/wiki/Chinese-README) https://github.com/node-schedule/node-schedule `定时任务` https://github.com/paulmillr/chokidar `最小和高效的跨平台文件监视库` https://github.com/shelljs/shelljs `Node.js的可移植Unix Shell命令` https://github.com/caolan/async `async是一个流程控制工具包` [[文档]](http://caolan.github.io/async/v3/index.htm...

根据自己想要的代理的效果, 选择其一 ```bash # 访问 /proxy1 # 实则访问 http://127.0.0.1:4000/ # 访问 /proxy1/ # 实则访问 http://127.0.0.1:4000// # 访问 /proxy1/test.html # 实则访问 http://127.0.0.1:4000/test.html location /proxy1 { proxy_pass http://127.0.0.1:4000/; } # 访问 /proxy2 或者 /proxy2/ # 实则访问 http://127.0.0.1:4000/ # 访问 /proxy2/test.html # 实则访问 http://127.0.0.1:4000/test.html location /proxy2/ { proxy_pass http://127.0.0.1:4000/; } # ============ # # 访问 /proxy3 或 /proxy3/ # 实则访问 http://127.0.0.1:4000/proxy3 # 访问...

需求: 将某一列值相同且相连的行合并 1, 模板: ```html <el-table :data="tableData" :span-method="objectSpanMethod"> <el-table-column prop="id" label="ID" width="180"></el-table-column> <el-table-column prop="name" label="姓名"> </el-table-column> <el-table-column prop="amount1" label="数值 1（元）"> </el-table-column> <el-table-column prop="amount2" label="数值 2（元）"> </el-table-column> <el-table-column prop="amount3" label="数值 3（元）"> </el-table-column> </el-table> ``` 2, 数据 ```javascript { data() {...

@[toc] 仓库地址: [https://github.com/lincenying/mmf-blog-vite-vue3](https://github.com/lincenying/mmf-blog-vite-vue3) 访问地址: [https://vue3.mmxiaowu.com](https://vue3.mmxiaowu.com) ## 1. vite 打包时, 一些 css 神秘消失 ### ~~1. 背景图片离奇消失~~ ```css .icon-menu-articles { width: 12px; height: 12px; background-image: url('../images/@1x/menu-articles.png'); } ``` css 中有这么一段样式, 经过 vite 编译后, 背景图片属性消失了, 经过多次测试后, 将图片放到ps编辑后, 重新保存, 好了, 初步判断是vite(也可能是中间某个插件)将图片转成base64时出了问题, 但是图片在之前的 vue-cli 中是正常的, 能正常转成 bas...

代码如下: ```javascript // use-lock-fn.js import { ref } from 'vue' // fn 需要增加竞态锁的函数 // autoUnlock === true 不管fn返回什么, 都自动解锁 // autoUnlock === false 不管fn返回什么, 都不自动解锁 // autoUnlock === 'auto' (默认值) 当fn返回false时, 不自动解锁, 返回其他值时, 自动解锁 const useLockFn = (fn = () => {}, autoUnlock = 'auto') => { const lock = ref(false) return async (...args) => { if (lock.value) return lock.value = true try { const $return = await fn(...args) if (autoUnlock === true ...

@[toc] `Windi CSS`是`Tailwind CSS`的下一代编译器。 如果您已经熟悉`Tailwind CSS`，可以考虑用`Windi CSS`替代`Tailwind CSS`，它提供了更快的加载时间，并支持`Tailwind CSS` v2.0及更高版本中的所有功能。 如果您不熟悉`Tailwind CSS`，则可以将`Windi CSS`视为实用程序优先的CSS库。 数值: ```css p-${float[0,...infinite]} -> padding: ${float/4}rem p-2.5 -> padding: 0.625rem; p-3.2 -> padding: 0.8rem; ``` 尺寸: ```css // ${size} must end up with rem|em|px|vh|vw|ch|ex p-${size} -> padding: ${size} p-3px -> padding: 3px; p-4rem -> padding: 4rem; ``` 分数: ```css w-${fraction} -> wi...

@[toc] # 需求: 仿微信聊天 需求很简单, 就是仿微信聊天, 下拉加载历史聊天记录时, 能保持浏览位置, 在网上找了一些例子都不太完美, 要么不能保持浏览位置, 要么会来回跳一下, 反正就是效果不好, 决定还是自己研究研究 # 处理方法 ## template 模板部分 使用 uniapp 自带的`scroll-view`来做滚动容器, 需要配合以下属性: 1. `scroll-y`: 允许纵向滚动 2. `scroll-top`: 设置竖向滚动条位置 3. `upper-threshold`: 距顶部/左边多远时（单位px），触发 scrolltoupper 事件 4. `@scrolltoupper`: 滚动到顶部/左边，会触发 scrolltoupper 事件 5. `scroll-anchoring`: 开启 scroll anchoring 特性，即控制滚动位置不随内容变化而抖动，仅在 iOS 下生效 ```html <scroll-view class="msg-list" scroll-y="true" :scroll-top="...

@[toc] ### 需求 页面中接口, 需要带上用户信息或者是某个鉴权字段, 这个用户信息或者鉴权字段由某个接口返回 ### 原生 Vue 中的处理方法 #### 1.vuex 配置 ```javascript import api from '@/api' const state = { userInfo: null, // 需要的用户数据 globalLoading: true // 一个全局loading, 根据这个字段觉得是否显示一个全局的loading小狗 } const actions = { // 读取用户信息 async ['getUserInfo'](store) { const { commit } = store const { data, code } = await api('/api/user/user_info') if (code === 200) { commit('receiveUserInfo', data) } ...

@[toc] # 1. 首先你得有台服务器 # 2. 推荐安装 linux 系统 本文以 CentOS 7.2 为例 # 3. 更换 yum 为国内镜像 1. 备份你的原镜像文件，以免出错后可以恢复。 ```bash # mv /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/CentOS-Base.repo.backup ``` 2. 下载新的CentOS-Base.repo 到/etc/yum.repos.d/ ```bash // CentOS 5 # wget -O /etc/yum.repos.d/CentOS-Base.repo https://mirrors.aliyun.com/repo/Centos-5.repo // CentOS 6 # wget -O /etc/yum.repos.d/CentOS-Base.repo https://mirrors.aliyun.com/repo/Centos-6.repo // CentOS 7 # wget -O /etc/yum.repos.d/CentOS-B...