爱吃巧克力的狗

摘要： 记录下研读vue-devtools源码的成果 ###开发者工具是如何从浏览器获取vue组件的相关状态 代码在packages\app-backend-core\src\legacy\scan.ts 简单点说从document开始往下遍历子元素，如果子元素有__vue__,那么就是vue组件绑定的do 阅读全文

摘要： 公共的代码包括公用的vue组件和js代码，从维护性的角度来说应该放到主包才对， 但是主包有大小限制，如果把2个分包都在用的代码放到主包里面那2M很快就满了。 所以该放在哪?我的方案是从维护的角度放在主包，然后用webpack的插件在打包的时候 把只有分包在用的vue和js代码分别放到分包中去。 un 阅读全文

摘要： 这次的优化我公司项目主包只减小了32kb，但是减小的不仅仅是主包，所有分包均在没有改动任何业务代码的情况下完成了压缩空间的优化。 主包分包压缩空间的优化都要视项目而定，32kb只是我公司的小程序项目。 还有一点需要提前说明，此优化我公司项目因为主包够用了就还没有正式使用，不保证完全没有问题，所以要辛 阅读全文

摘要： 不是标题党，我们公司的项目确确实实是省下了100kb的主包空间，而且还是在没有牺牲任何的性能和业务的前提下实现的。 但是100kb是根据项目大小，所以你用这个插件可能省下超过100kb或者更少。 ###直接上代码看效果 一个名为fixMiniCssPlugin的插件，在vue.config.js使用 阅读全文

摘要： ###prop传值给组件 // 页面的wxml，aa是组件 tabs是页面传给aa的prop，除此之外还会传过来一个vue-id的prop // 还会绑定一个__l方法，在子组件的attached钩子内部会触发来建议vue实例之间的父子关系 <aa vue-id="8dd740cc-1" tabs= 阅读全文

摘要： ###页面点击触发vm（vue实例）的方法 uni里的vue代码 <template> <view class="content" @click="qq" @longpress='fq' > 3345 </view> </template> 经过uni转换后的小程序wxml代码 <view data 阅读全文

摘要： uni的vue代码是如何在微信小程序里面执行的，对此比较感兴趣所以去调试学习了一波. ###准备工作 // 在vue.config.js里打开非压缩的代码 module.exports = { configureWebpack: config => { config.devtool = 'none' 阅读全文

摘要： mini-css-extract-plugin 是用来把所有css提取打包成一个文件的插件，uni把vue文件的css打包成wxss文件就是使用此插件完成的。这个插件还内置了一个处理css的loader ###mini-css-extract-plugin的loader作用 位置在mini-css- 阅读全文

摘要： vue-clearcss 会找到你css中没有使用的css样式，是否删除由使用者自己决定，工作起来就像eslint ###为什么要用它？ 一个vue文件在长期迭代中css会越来越冗余，它不像html和js那么好删除，html你要是多了页面会展示，js你只要看下它用的地方就可以了 然而css比如scs 阅读全文

摘要： 最近写了个小插件报了个警告，然后去百度了一下，全都给我说extract-text-webpack-plugin这个插件有问题要更新，我也是无语了，这个插件我用都没用，百度翻了下齐刷刷全是这个答案，搞得我都怀疑自己然后把node_modules翻了一遍确定没有使用这个插件，后来去谷歌上搜了一下，第一条 阅读全文