<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[DIWUCH的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/DIWUCH</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; DIWUCH]]></copyright><item><title><![CDATA[Vite学习笔记----踩过的坑（不定时更新）]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/125525004</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/125525004</guid><author>DIWUCH</author><pubDate>Wed, 29 Jun 2022 22:00:00 +0800</pubDate><description><![CDATA[vite踩坑记录]]></description><category></category></item><item><title><![CDATA[Vite学习笔记----多页面配置]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/125523708</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/125523708</guid><author>DIWUCH</author><pubDate>Wed, 29 Jun 2022 21:00:00 +0800</pubDate><description><![CDATA[vite多页面配置




可以看到这个页面被我注释了，因为对于最后的打包来说是没意义的，只作为本地开发调试的一个指向工作，如下：


启动，浏览器输入http://localhost:3000，访问成功]]></description><category></category></item><item><title><![CDATA[Vite学习笔记----插件配置（不定时更新）]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/124993798</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/124993798</guid><author>DIWUCH</author><pubDate>Wed, 29 Jun 2022 20:30:00 +0800</pubDate><description><![CDATA[目录一. 打包代码分析二. 引入外部cdn


小tips：同类型插件很多不知道怎么选择可以参考npm下载量对比网站

一. 打包代码分析

使用rollup-plugin-visualizer插件，不同与webpack的分析插件，不配置参数的情况下，这个插件默认生成的state.html会在根目录，而不是dist文件夹

import visualizer from 'rollup-plugin-visualizer'

……
plugins: [visualizer()]
……


二. 引入外部cdn]]></description><category></category></item><item><title><![CDATA[webpack学习笔记1（配置相关）]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/124895619</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/124895619</guid><author>DIWUCH</author><pubDate>Wed, 25 May 2022 20:00:00 +0800</pubDate><description><![CDATA[目录前言一. browserlitrc配置1.  browserslist2. 配置平台兼容要求

前言
记录下webpack常用的一些知识点
一. browserlitrc配置
1.  browserslist

webpack安装默认会装browserslist，主要就是提供符合当前项目平台兼容性的参考

进入node_modules\browserslist\index.js文件可以看到这一条：
var agents = require('caniuse-lite/dist/unpacker/agen]]></description><category></category></item><item><title><![CDATA[ES6知识点读书笔记1]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/118248199</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/118248199</guid><author>DIWUCH</author><pubDate>Wed, 25 May 2022 10:48:04 +0800</pubDate><description><![CDATA[let和const


仅在其代码块内有效（参考for循环计数器）


let不存在变量提升，不会污染全局变量


console.log(foo); // 输出undefined
var foo;

console.log(bar);
let bar; // 报错ReferenceError


暂时性死区（TZD）
即区块中存在let或const，则一开始对这些命令声明的变量形成封闭作用于，提前使用就报错

if (true) {
	foo = 'a'; // ReferenceError
	let f]]></description><category></category></item><item><title><![CDATA[Taro（vue2）小程序虚拟列表实操]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/124794415</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/124794415</guid><author>DIWUCH</author><pubDate>Wed, 18 May 2022 16:46:00 +0800</pubDate><description><![CDATA[目录前言一、先通俗易懂的理解虚拟列表二、使用步骤1.引入库2.读入数据总结

前言
项目突降需求，开发微信小程序，经过几轮对比，选择了Taro + Vue2开发，其中遇到了一个虚拟列表的坑点，特此记录下踩坑和跳坑的过程

一、先通俗易懂的理解虚拟列表

其实这个已经被用烂了的前端优化手段，没啥可讲的，但我不一样，我就是要再复习一遍。（不想看的可以跳过到第二个标题）

一般需要虚拟列表介入的情况就是：当前页面已经 或 可预见会加载很大量级的数据。
就像世道无情但人间有情一样，列表无限但可视有限，虚拟列表揉圆搓]]></description><category></category></item><item><title><![CDATA[Vue项目引入自定义字体]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/124681763</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/124681763</guid><author>DIWUCH</author><pubDate>Tue, 10 May 2022 20:00:00 +0800</pubDate><description><![CDATA[vue引入自定义字体的具体操作]]></description><category></category></item><item><title><![CDATA[git remote相关命令操作git库]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/124192514</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/124192514</guid><author>DIWUCH</author><pubDate>Thu, 05 May 2022 20:30:00 +0800</pubDate><description><![CDATA[1、查看远程库
git remote -v

2、修改/添加远程库
第一种方法
git remote rm origin


]]></description><category></category></item><item><title><![CDATA[Taro-react-ts小程序报红提示找不到types]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/120706396</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/120706396</guid><author>DIWUCH</author><pubDate>Mon, 11 Oct 2021 16:46:24 +0800</pubDate><description><![CDATA[处理类似`wx`，要安装不同types文件，官网没找到，是去GitHub找民间小能手写的链接总结到下面，自行安装]]></description><category></category></item><item><title><![CDATA[TS学习笔记1]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/118309101</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/118309101</guid><author>DIWUCH</author><pubDate>Sat, 03 Jul 2021 12:19:17 +0800</pubDate><description><![CDATA[typescript安装
npm install -g typescript

ts基础类型
注意：均为小写
boolean、number、string、void、undefined、null、symbol
const a: string = 'a'
const a: number = 1
const a: boolean = false

// array两种
const a: number[] = [1, 2, 3]
const a: Array&lt;number&gt; = [1, 2, 3]

/]]></description><category></category></item><item><title><![CDATA[初次使用hammer.js做卡片滑动效果]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/94439081</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/94439081</guid><author>DIWUCH</author><pubDate>Tue, 02 Jul 2019 17:30:44 +0800</pubDate><description><![CDATA[项目新需求做卡片滑动的效果，因为大多数的一些js插件库是分开监听X和Y方向的，但是hammer.js是监听全方位，比较满足项目需求，所以初次尝试使用了下。大致如下：



具体的文档可以参考hammer.js官方文档：
http://hammerjs.github.io

我们主要使用了两个监听事件：

panmove

主要为了监听手指移动距离来移动上层图片以及下层图片放大的比例

pan...]]></description><category></category></item><item><title><![CDATA[react-native安卓splash适配刘海屏]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/89857841</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/89857841</guid><author>DIWUCH</author><pubDate>Mon, 06 May 2019 00:00:52 +0800</pubDate><description><![CDATA[安卓全面屏要18:9的splash图

以后要换splash的时候记得要设计妹纸给一个1080x2160尺寸的splash图，然后：

{项目}\android\app\src\main\res\
下建一个

drawable-xxhdpi-2034x1080

文件夹再把图片放进去

（ps：必须是 高度x宽度 这种命名,一定要按照上面这个命名奥）

网上查是可用分辨率的原因，不能把文件夹命名成...]]></description><category></category></item><item><title><![CDATA[第三方app唤醒react-native项目]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/89857741</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/89857741</guid><author>DIWUCH</author><pubDate>Sun, 05 May 2019 23:51:46 +0800</pubDate><description><![CDATA[一、 安卓配置

在{项目}/android/app/src/main/AndroidManifest.xml文件下添加：


&lt;intent-filter&gt;

&lt;action android:name="android.intent.action.VIEW" /&gt;

&lt;category android:name="android.intent.categor...]]></description><category></category></item><item><title><![CDATA[关于display：none；的图片加载]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/79220853</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/79220853</guid><author>DIWUCH</author><pubDate>Thu, 01 Feb 2018 14:24:15 +0800</pubDate><description><![CDATA[1、如果元素有{display: none;}的样式的话，标签上的图片会被请求加载，但是不会被渲染


例子：


.img-container {
background-image: url(../imgs/icon1.png);
}






其中icon1.png和icon2.png会请求后端进行加载，但是因为样式属性不会计算该元素的布局


2、如果父元素有{d]]></description><category></category></item><item><title><![CDATA[git命令汇总（持续更新）]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/79097614</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/79097614</guid><author>DIWUCH</author><pubDate>Thu, 18 Jan 2018 16:24:03 +0800</pubDate><description><![CDATA[1、拉代码库git clone [代码库名]2、自己建分支git checkout -b [name]3、从[name]推代码git push origin [name]4、拉别人建的分支git checkout -b [name] origin/[name] 举例：git checkout -b dev origin/dev5、从[name]拉代码代码git pull origin [name]]]></description><category></category></item><item><title><![CDATA[对话框扇形跳动demo]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/79046606</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/79046606</guid><author>DIWUCH</author><pubDate>Fri, 12 Jan 2018 17:38:56 +0800</pubDate><description><![CDATA[用纯CSS3做动画效果：








html,body,div,h1,a,ul,li,label,span,p{
     margin: 0;
     padding: 0;
}
body{
     font:12px/1.4 Arial,'Microsoft YaHei','Helvetica Neue','Myriad Pro', 'Hiragino Sans GB',  'W]]></description><category></category></item><item><title><![CDATA[总结css常用的样式]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/79045159</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/79045159</guid><author>DIWUCH</author><pubDate>Fri, 12 Jan 2018 16:03:41 +0800</pubDate><description><![CDATA[会持续更新：1、强制文本换行div {
word-break: break-all;
word-wrap:break-word;
white-space: normal;
}2、input更改placeholder颜色/* WebKit browsers */
input::-webkit-input-placeholder { 
    color: #c7c7c7c;
}
/* Mozilla...]]></description><category></category></item><item><title><![CDATA[react-native-splash-screen插件安装apk发生crash]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/79005731</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/79005731</guid><author>DIWUCH</author><pubDate>Mon, 08 Jan 2018 18:05:07 +0800</pubDate><description><![CDATA[react native 使用 react-native-splash-screen插件，具体文档：


https://github.com/crazycodeboy/react-native-splash-screen


按照文档走过以后，发现打包出来的apk在7.0的手机上一直crash，后来通过adb抓取报错如下：


AndroidRuntime: java.lang]]></description><category></category></item><item><title><![CDATA[汇总前端会用到的技术文档地址（持续更新）]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/78688080</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/78688080</guid><author>DIWUCH</author><pubDate>Fri, 01 Dec 2017 16:31:35 +0800</pubDate><description><![CDATA[1、各类文档翻译版汇总

https://www.docschina.org/





2、jQuery文档地址

http://api.jquery.com/





3、Typescript中文地址

https://www.tslang.cn/docs/home.html





4、Nodejs

http://nodejs.cn/doc/node/





5、w...]]></description><category></category></item><item><title><![CDATA[解决ionic在手机上拍照图片旋转的问题]]></title><link>https://blog.youkuaiyun.com/DIWUCH/article/details/77528569</link><guid>https://blog.youkuaiyun.com/DIWUCH/article/details/77528569</guid><author>DIWUCH</author><pubDate>Thu, 24 Aug 2017 12:13:36 +0800</pubDate><description><![CDATA[ionic项目使用手机拍照后图片在安卓手机上显示是旋转了90度的，这个时候需要借助外部js-----exif.js


1、先下载 exif.js 到项目中，用 npm 命令行:


npm install exif-js --save



2、然后在index.html引入：





3、将exif.js文件复制到项目根目录下www文件夹中：


{项目]]></description><category></category></item></channel></rss>