qq_42975998的博客

html2canvas

1、根目录下新建.env.development和.env.production文件名必须是这样定义，否则读取不到其中写node环境变量和其它变量其它变量必须要以VITE_开头NODE_ENV = "development"VITE_BASE_URL = "http://127.0.0.1:3333"2、在tsconfig.json中添加"types": [ "vite/client" ]，用来提供import.meta.env 上 Vite 注入的环境变量的类型定义"compiler

小程序在输入银行卡号时每四位空一格用replace就可以实现.replace(/\s/g, '').replace(/[^\w./]/g, '').replace(/(\w{4})(?=\w)/g, '$1 ');但是当改变中间某一位时，如果使用setData重新给输入框赋值就会导致光标跳到最后一位，所以要使用cursor属性让光标不乱跑wxml:<view> <text>银行账号</text> <input type="number

使用canvas进行截图，就是在canvas画布上把想要的东西画一遍然后保存成图片。如果是线上图片要使用wx.getImageInfo进行转换再显示在canvas上wxml:<view class="canvas-box" > <canvas type="2d" id="canvas" style='width:100%; height:{{canvasHeight}}px'></canvas></view><view&g

优化开发体验：1.区分环境2.压缩代码3.CDN 加速4.使用 Tree Shaking5.提取公共代码6.按需加载1.区分环境if (process.env.NODE_ENV === 'production') { console.log('你正在线上环境');} else { console.log('你正在使用开发环境');}2.压缩代码压缩的方法除了可以通过 GZIP 算法对文件压缩外，还可以对文本本身进行压缩。对文本本身进行压缩的作用除了有提升网页加载速度的优势外，还具有

优化可以分为优化开发体验和优化输出质量两部分优化开发体验：1.优化构建速度1.缩小文件搜索范围2.使用3.使用 HappyPack4.使用 ParallelUglifyPlugin1.缩小文件搜索范围1）优化 loader 配置由于 Loader 对文件的转换操作很耗时，需要让尽可能少的文件被 Loader 处理，可以通过 include 去命中只有哪些文件需要被处理。module.exports = { module: { rules: [ { // 如

Webpack 内置了很多功能。我们只需要大概明白 Webpack 原理和核心概念去判断选项大致属于哪个大模块下，再去查详细的使用文档。想让源文件加入到构建流程中去被 Webpack 控制，配置 entry。想自定义输出文件的位置和名称，配置 output。想自定义寻找依赖模块时的策略，配置 resolve。想自定义解析和转换文件的策略，配置 module，通常是配置module.rules 里的 Loader。其它的大部分需求可能要通过 Plugin 去实现，配置 plugin。常用配置e

目录一、Loader二、Plugin三、DevServer四、核心概念一、LoaderLoader可以看作具有文件转换功能的翻译员，配置里的 module.rules 数组配置了一组规则，告诉 Webpack在遇到哪些文件时使用哪些 Loader 去加载和转换。Webpack 不原生支持解析 CSS 文件。要支持非 JavaScript类型的文件，需要使用 Webpack 的 Loader 机制。例：配置告诉 Webpack 在遇到以 .css 结尾的文件时先使用 css-loader 读取

先上效果：容器：<template> <div> <Tree :treeData="treeData"></Tree> </div></template><script> import Tree from './tree' export default { name:'h...