<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/jiangqing993</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; jiangqing993]]></copyright><item><title><![CDATA[mac安装node管理工具nvm]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/141671128</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/141671128</guid><author>jiangqing993</author><pubDate>Fri, 30 Aug 2024 20:16:01 +0800</pubDate><description><![CDATA[但是，可能还有遇到一个问题，，就是当前安装的文件夹下命令行node版本啥都对的，，当我们换一个文件夹，或者重新在别的文件夹下打开一个命令行，node版本就不是我们刚刚的版本，，这是因为nvm的默认default是一个版本，我们nvm install新安装的又是一个版本，所以导致的不一样。重新执行下载就可以了，应该就可以成功，下载完， 我们执行 nvm -v如果成功就会返回版本号，不行的话，重启下命令行试试。这时候，我们需要配置一个host，因为我本地有hosts软件，我就直接在里面配置了，]]></description><category></category></item><item><title><![CDATA[移动端前端开发主流框架及其技术方案]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/141722244</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/141722244</guid><author>jiangqing993</author><pubDate>Fri, 30 Aug 2024 16:53:27 +0800</pubDate><description><![CDATA[选择合适的移动端前端框架对于开发高质量的应用至关重要。提供了原生性能和高效的开发体验，适合需要高度互动和性能的应用；Flutter以其高性能渲染和高度自定义的 UI 设计脱颖而出，适合需要一致用户体验和复杂用户界面的应用；Ionic则利用 Web 技术实现快速开发，特别适合需要同时在 Web 和移动端发布的应用。了解这些框架的核心特性和技术实现可以帮助开发者根据项目需求做出最佳选择。]]></description><category></category></item><item><title><![CDATA[微服务 ModuleFederationPlugin Vue项目体验]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/129113919</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/129113919</guid><author>jiangqing993</author><pubDate>Mon, 20 Feb 2023 08:11:29 +0800</pubDate><description><![CDATA[随着公司项目的模块越来越多，每次打包后的项目都非常大，而且每修改一个小的模块，都会将整个项目打包，会非常的麻烦，随着前端的发展，微服务的出现，很好的解决了项目庞大的问题，而且每修改一个模块，可以单独打包发布。项目的公共组件，因为每个单独项目都会有公共的组件，不可能每个项目都复制一份，这样冗余代码太多，也不好维护1、可以通过构建一个项目组件，发布到npm上面npm麻烦的地方，在于每次组件的修改，都需要升级npm的版本号，每个项目需要重新更新新的组件，也挺麻烦的。]]></description><category></category></item><item><title><![CDATA[vue列表中为什么要设置key，有什么作用？为什么key最好不要设置为index?]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/125921644</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/125921644</guid><author>jiangqing993</author><pubDate>Thu, 21 Jul 2022 22:22:25 +0800</pubDate><description><![CDATA[2、当我们在头部插入一个节点，是不是插入的节点就变成0，原来的0、1、2、3、4都加一位，我们来diff比较的时候，是不是每一项又都不一样了，sameVnode返回的都是false，标签不能复用，都要重新创建一个，插入到节点中，这样是不是也全部需要重新渲染，影响性能。3、如果我们列表每一项有一个chekbox元素，勾选的第一项，再插入新元素的时候，是不是你插入的节点被勾选了，这样是不是就不对了，有问题。4、而且每一个元素都替换，是不是特别慢，并且列表需要全部重新渲染，大大的影响的性能。...]]></description><category></category></item><item><title><![CDATA[export default 导出的对象，不能解构问题，和module.exports的区别]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/125557484</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/125557484</guid><author>jiangqing993</author><pubDate>Fri, 01 Jul 2022 14:51:34 +0800</pubDate><description><![CDATA[最近在做项目过程中，遇到一个问题，对一个UI组件，解构出我们需要的组件，进行注册，但是运行的时候报错了，写了一个小例子


代码运行编译时候报错了 说没有找到obj和obj2，这是为什么？我们来把代码修改下


通过 webpack打包下，然后来看下，打包完以后，在main.js，把index.js打包编译成什么样子 看过webpack打包源码的都知道，通过import导入在打包的时候
import会被替换成__webapck_require_方法，去获取，参数1是因为我们现在有两个文件，一个是index.]]></description><category></category></item><item><title><![CDATA[什么是BFC？BFC可以解决什么问题]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/125321816</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/125321816</guid><author>jiangqing993</author><pubDate>Thu, 16 Jun 2022 19:58:42 +0800</pubDate><description><![CDATA[一、规范解释：块格式化上下文（Block Formatting Context，BFC）是Web页面的可视化CSS渲染的一部分，是布局过程中生成块级盒子的区域，也是浮动元素与其他元素的交互限定区域二、通俗理解：BFC 是一个独立的布局环境,可以理解为一个容器,在这个容器中按照一定规则进行物品摆放,并且不会影响其它环境中的物品三、BFC是一个css渲染特殊的一部分，需要一定的条件才能触发四、BFC可以解决的问题1、解决外边距塌陷的问题1）、父子元素的外边距塌陷问题我们在一个元素内部子元素，设置了一个margi]]></description><category></category></item><item><title><![CDATA[JS 的 new 操作符到底做了什么？]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/125150998</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/125150998</guid><author>jiangqing993</author><pubDate>Mon, 06 Jun 2022 17:32:53 +0800</pubDate><description><![CDATA[2、把这个新的空对象的隐士原型（）指向构造函数的原型对象（）3、把构造函数中的 this 指向新创建的空对象并且执行构造函数返回执行结果4、判断返回的执行结果是否是引用类型，如果是引用类型则返回执行结果，new 操作失败，否则返回创建的新对象...]]></description><category></category></item><item><title><![CDATA[手动实现Promise方法（原理）]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/124353444</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/124353444</guid><author>jiangqing993</author><pubDate>Sat, 23 Apr 2022 18:50:06 +0800</pubDate><description><![CDATA[我们在使用Promise，为了解决异步操作，去实现同步代码的作用

平时开发时候，我们很多时候，需要等待接口返回后，去做一些处理，或者借用返回值，再调用，，如果用传统的方法，我们容易陷入回调地狱的问题，代码的可读性也不是很好

现在我们来看下Promise的原理，是如何实现的

1、Promise是一个类，执行这个类的时候，需要传入一个执行器进去，执行器立即执行


class myPromise{
    // executor执行器
    constructor(executor){
        ]]></description><category></category></item><item><title><![CDATA[webpack的构建流程]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/123317760</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/123317760</guid><author>jiangqing993</author><pubDate>Sun, 06 Mar 2022 21:33:04 +0800</pubDate><description><![CDATA[1、初始化参数：从配置文件和shell语句中读取与合并参数，得出最终的参数

2、开始编译：用上一次得到的参数初始化compiler对象，加载所有配置的插件，执行对象的run方法开始执行编译

3、确定入口：根据配置的entry找出所有的入口文件

4、编译模块：从入口文件出发，调用所有配置的loader对模块进行编译，再找出该模块依赖的模块，在递归本步骤直到所有入口依赖的文件都经过本步骤的处理

5、完成模编译：经过第四步对所有模块的编译以后，得到了每个模块被翻译后的最终内容以及它们之间的依赖关系

6、]]></description><category></category></item><item><title><![CDATA[Vue2.0源码（二）模板编译原理]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/118329218</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/118329218</guid><author>jiangqing993</author><pubDate>Tue, 29 Jun 2021 17:09:43 +0800</pubDate><description><![CDATA[上一篇文章主要介绍了 Vue 数据的响应式原理，今天我们主要说的是模板编译原理，主要涉及到 ast 以及大量正则匹配


// Vue实例化
new Vue({
  el: "#app",
  data() {
    return {
      a: 111,
    };
  },
  // render(h) {
  //   return h('div',{id:'a'},'hello')
  // },
  // template:`&lt;div id="a"&gt;hello&lt;/di.]]></description><category></category></item><item><title><![CDATA[Vue2.0源码（一）响应式数据原理]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/118191147</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/118191147</guid><author>jiangqing993</author><pubDate>Thu, 24 Jun 2021 22:06:57 +0800</pubDate><description><![CDATA[Vue.js 一个核心思想是数据驱动。所谓数据驱动，是指视图是由数据驱动生成的，我们对视图的修改，不会直接操作 DOM，而是通过修改数据。之前的jquery想要改变试图，是直接操作DOM来实现。现在我们只需要关心数据的改变会让代码的逻辑变的非常清晰。

Vue 内部就有一个机制能监听到数据变化然后触发更新 本篇主要介绍响应式数据的原理

1、数据的初始化


new Vue({
  el: "#app",
  router,
  store,
  render: (h) =&gt; h(App),
});.]]></description><category></category></item><item><title><![CDATA[Faild to install the app. Please accept all necessary Android SDK licenses using aandroid SDK Manage]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/106908419</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/106908419</guid><author>jiangqing993</author><pubDate>Mon, 22 Jun 2020 19:38:13 +0800</pubDate><description><![CDATA[在我们react-native项目，通过react-native run android启动项目的时候，报了这样的错误，其实是我们在安装android-sdk时，少了安装了东西，见下图

图中画圈的地方，就是我们报错的原因，少了android-sdk 28，打开我们的Android-sdk

双击打开


我们可以看到android-sdk 28我们没有下载，，我们勾选几个28，，然后install packages
可能我们缺少并不只是28版本，，也有可能是别的，我们缺少什么我们就可以去找，然后insta]]></description><category></category></item><item><title><![CDATA[react-native 选择相册或者拍照，app自动退出问题]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/106646590</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/106646590</guid><author>jiangqing993</author><pubDate>Tue, 09 Jun 2020 17:18:41 +0800</pubDate><description><![CDATA[我在react-native项目中，运用的第三方插件进行的选择相册图片，在点击的时候，app就自动关闭了
react-native-image-crop-picker 对图片的处理
ImagePicker.openPicker({
    width: 300,
    height: 300,
    cropping: true,
  }).then((image) =&gt; {
    console.log(image);
  });

iOS 10 开始对隐私权限更加严格, 如需使用隐私权限需要]]></description><category></category></item><item><title><![CDATA[vue自定义指令v-loading]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/104320349</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/104320349</guid><author>jiangqing993</author><pubDate>Fri, 14 Feb 2020 22:23:47 +0800</pubDate><description><![CDATA[在我们的实际开发中，项目当中需要加载一些信息的时候，且不能操作，这样就需要在上面放个遮罩层显示加载中

这就需要我们自定义指令v-loading

首先我们创建文件
在src文件下建directive文件夹，里面创建index.js，loading文件夹里面创建Loading.vue和index.js
loading.vue组件，用来插入到自定义指令的目标元素中
// src/directive/...]]></description><category></category></item><item><title><![CDATA[Vue项目Axios配置不同baseUrl，请求不同服务器的接口]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/103731111</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/103731111</guid><author>jiangqing993</author><pubDate>Fri, 27 Dec 2019 14:53:39 +0800</pubDate><description><![CDATA[项目需求
最近使用 Vue 开发后台管理系统项目,开发过程遇到一个特别闹心的事情，由于项目没有上线,所有接口地址都是后台人员的电脑做为服务器，这个项目有几个后台同时开发接口，每一个大模块对应的接口地址不一样。这样按照常规写接口地址，只能调用一个模块，这样很不方便，也不符合前端的设计理念
下面我们就封装一个可以调用不同服务器的方法
第一步、新建一个serviceList.js文件 /src/conf...]]></description><category></category></item><item><title><![CDATA[在固定框高内图片剧中显示，不变形]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/103408106</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/103408106</guid><author>jiangqing993</author><pubDate>Thu, 05 Dec 2019 16:48:37 +0800</pubDate><description><![CDATA[&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;

&lt;head&gt;
  &lt;meta charset="UTF-8"&gt;
  &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
  &lt;meta http-equiv="X-UA-Com...]]></description><category></category></item><item><title><![CDATA[vue引入markdown文件]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/103274158</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/103274158</guid><author>jiangqing993</author><pubDate>Wed, 27 Nov 2019 14:02:23 +0800</pubDate><description><![CDATA[1. 创建一个vue项目

vue create mdVue

因为我的示例在整个vue项目中，需要下载相应的依赖

yarn add vue-router

用到less编写样式

yarn add --dev less less-loader

用到iview的页面布局

yarn add iview

可以引入md文件

yarn add vue-markdown-loader

main....]]></description><category></category></item><item><title><![CDATA[创建一个自己的网站nginx，搭建站点]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/102667912</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/102667912</guid><author>jiangqing993</author><pubDate>Mon, 21 Oct 2019 17:15:19 +0800</pubDate><description><![CDATA[首先要有自己的服务器和域名
登录服务器
ssh root@192.168.1.114

1、root服务器的用户名，一般默认都是root
2、192.168.1.11对应的是服务器的公网IP，这个在购买服务器后台可以查看到
输入后，就会让你输入服务器密码
显示就是已经登陆上了
接下来就是在服务器上安装nginx
yum list nginx*

运行上面命令，查看服务器上是否有nginx包
就会出...]]></description><category></category></item><item><title><![CDATA[vue项目引入iview,标签语法报错]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/100669679</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/100669679</guid><author>jiangqing993</author><pubDate>Mon, 09 Sep 2019 19:02:32 +0800</pubDate><description><![CDATA[我们在新建一个vue项目，引入iview，写页面的时候，会遇到页面标签语法报错现象

看控制台时候会提示

会出现这样的报错
但是网上找答案

在vscode菜单中，文件-&gt;首选项-&gt;设置，找到 “vetur.validation.template”: true 将其改为false，关闭eslint的检查-----但是这样设置后，报错还是存在

其实在vue项目中加上几行代码就可以了，...]]></description><category></category></item><item><title><![CDATA[js判断数据类型]]></title><link>https://blog.youkuaiyun.com/jiangqing993/article/details/100351643</link><guid>https://blog.youkuaiyun.com/jiangqing993/article/details/100351643</guid><author>jiangqing993</author><pubDate>Mon, 02 Sep 2019 20:01:50 +0800</pubDate><description><![CDATA[判断数据类型
我们有几种方式判断
1、typeof
console.log(typeof 123)   // number
console.log(typeof 'java') // string
console.log(typeof true)  // boolean
console.log(typeof undefined)  //undefined
console.log(typeof nu...]]></description><category></category></item></channel></rss>