<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[hellenYuan的博客]]></title><description><![CDATA[]]></description><link>https://blog.youkuaiyun.com/hellenYuan</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; hellenYuan]]></copyright><item><title><![CDATA[纯css实现动态环形-vue3+ts]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/125408574</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/125408574</guid><author>hellenYuan</author><pubDate>Wed, 22 Jun 2022 16:32:15 +0800</pubDate><description><![CDATA[纯css实现动态环形百分比]]></description><category></category></item><item><title><![CDATA[vue前端项目部署到服务器上的nginx配置]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/123084507</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/123084507</guid><author>hellenYuan</author><pubDate>Wed, 23 Feb 2022 10:35:51 +0800</pubDate><description><![CDATA[#user  nobody;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       mime.types;
    defau.]]></description><category></category></item><item><title><![CDATA[【vue项目的微前端】主项目和子项目的vue.config.js配置文件]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/123046590</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/123046590</guid><author>hellenYuan</author><pubDate>Mon, 21 Feb 2022 14:29:01 +0800</pubDate><description><![CDATA[子项目的vue.config.js:
const packageName = require('./package.json').name;
const Timestamp = new Date().getTime();

module.exports = {
  publicPath: process.env.VUE_APP_PUBLIC_PATH,
  // transpileDependencies: ['common'],
  chainWebpack: config =&gt; config.re]]></description><category></category></item><item><title><![CDATA[vue项目中附件下载方法封装，并提取成全局共用方法]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/122998481</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/122998481</guid><author>hellenYuan</author><pubDate>Fri, 18 Feb 2022 10:53:10 +0800</pubDate><description><![CDATA[如果项目中有多个页面用到附件下载的方法，那么可以将这个方法封装成一个全局方法，减少重复代码。

在main.js同级目录下新建一个GLOBAL.vue文件，在里面可以声明很多全局共用方法。

&gt;&gt; GLOBAL.vue
&lt;scirpt&gt;
import { fileDownload } from '../HTTP/myApis'

const downloadAttachment = async (fileid, rename, type) =&gt; {
  await fileDo]]></description><category></category></item><item><title><![CDATA[Api封装实例]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/122998015</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/122998015</guid><author>hellenYuan</author><pubDate>Fri, 18 Feb 2022 10:44:22 +0800</pubDate><description><![CDATA[把axios方法封装成一个个的函数，并统一在一个文件中：
&gt;&gt; allApis.js
import api from './myAxios'

// GET
export const getAllNavList = () =&gt; {
	return api({
		url: '...',
		method: 'get'
	})
}
// GET - 带参数
export const getAllNavList = (data) =&gt; {
	return api({
		url: '..]]></description><category></category></item><item><title><![CDATA[node-sass配置淘宝镜像仓库不生效解决办法]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/122977854</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/122977854</guid><author>hellenYuan</author><pubDate>Thu, 17 Feb 2022 10:38:37 +0800</pubDate><description><![CDATA[npm配置淘宝镜像的时候，node-sass要单独配置]]></description><category></category></item><item><title><![CDATA[根源解决node-sass下载慢的问题]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/122969332</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/122969332</guid><author>hellenYuan</author><pubDate>Wed, 16 Feb 2022 18:13:13 +0800</pubDate><description><![CDATA[使用dart-sass 代替 node-sass
终端安装： 运行下面命令
npm install node-sass@npm:sass

或者配置 package.json
"devDependencies": {
	"node-sass": "npm:dart-sass@^1.25.0"
}


]]></description><category></category></item><item><title><![CDATA[多个vue项目共用一个node-modules文件夹的方法]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/122967692</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/122967692</guid><author>hellenYuan</author><pubDate>Wed, 16 Feb 2022 17:15:19 +0800</pubDate><description><![CDATA[问题背景：
一个目录下有多个vue项目。
&gt;&gt; root
	-- my-vueproject-a
		-- package.json
		-- node-modules
	-- my-vueproject-b
		-- package.json
		-- node-modules

...

期望结果：
将所有vue项目中的依赖包提取为一个
&gt;&gt; root
	-- my-vueproject-a
	-- my-vueproject-b
	-- package.json
	-- nod]]></description><category></category></item><item><title><![CDATA[[技术积累]vue中对时间的处理-时间戳、时区转换]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/120490540</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/120490540</guid><author>hellenYuan</author><pubDate>Sun, 26 Sep 2021 17:34:38 +0800</pubDate><description><![CDATA[时间戳获取 .getTime() - 方法之一
let currentTime = new Date(); // 获取时间:Sun Sep 26 2021 15:49:55 GMT+0800 (中国标准时间)
// 转换成时间戳:
let timeStamp = currentTime.getTime(); // 1632642703153



把时间戳转换成时间
var time = new Date(时间戳);
var y = time.getFullYear();
var m = time.ge..]]></description><category></category></item><item><title><![CDATA[i18n如何在js文件中生效]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/119992723</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/119992723</guid><author>hellenYuan</author><pubDate>Mon, 30 Aug 2021 11:03:17 +0800</pubDate><description><![CDATA[在vue项目中引用vue-i18n实现语言切换功能，开发过程中发现，在vue文件中使用都可以，但是在js文件中直接使用$t('zhKey.首页')是不生效的。
下面是我研究出解决办法：
// js文件中
import Vue from 'vue'
import VueI18n from 'vue-i18n'
import messages from 'unisoc-ui/js/i18n/langs'

Vue.use(VueI18n) // 这里一行是必须加的。
// 在该js文件中，单独注册一个i18n实]]></description><category></category></item><item><title><![CDATA[vue状态共享除了vuex还可以用Vue.observable(obj) API]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/116043136</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/116043136</guid><author>hellenYuan</author><pubDate>Fri, 23 Apr 2021 10:53:57 +0800</pubDate><description><![CDATA[vue.js 2.6 新增了Observable API， 通过这个api，可以应对一些简单的跨组件数据共享。像是简易版vuex
// store.js中（不需要安装vuex了）
import Vue from 'vue';
// 提供store（states）和mutations方法，实现多个组件共享数据状态
export let store =Vue.observable({count:0,name:'李四'});
export let mutations={
    setCount(count){
]]></description><category></category></item><item><title><![CDATA[MarkDown 超链接页面内和通过新窗口打开]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/109352971</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/109352971</guid><author>hellenYuan</author><pubDate>Sat, 27 Mar 2021 21:53:50 +0800</pubDate><description><![CDATA[跳到自己博客列表
跳到自己博客列表：http://write.blog.youkuaiyun.com/postlist
跳到自己博客列表
跳到自己博客列表：http://write.blog.youkuaiyun.com/postlist

&lt;a href="http://write.blog.youkuaiyun.com/postlist" target="_blank"&gt;跳到自己博客列表&lt;/a&gt;
跳到自己博客列表：&lt;a href="http://write.blog.youkuaiyun.com/postlist" t.]]></description><category></category></item><item><title><![CDATA[vue项目中express安装]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/108997624</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/108997624</guid><author>hellenYuan</author><pubDate>Sat, 27 Mar 2021 21:53:12 +0800</pubDate><description><![CDATA[npm i express --save
全局： npm install -g express-generator
运行：express -e myserver
cd myserver
cnpm i
npm start



]]></description><category></category></item><item><title><![CDATA[vue中使用＜pre＞＜code＞标签插入演示代码的高亮插件-vue-highlight的使用]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/110121099</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/110121099</guid><author>hellenYuan</author><pubDate>Sat, 27 Mar 2021 21:51:30 +0800</pubDate><description><![CDATA[npm install vue-code-highlight --save

局部引入
import { component as VueCodeHighlight } from 'vue-code-highlight';

components:{
  VueCodeHighlight,
  ...
}

&lt;vue-code-highlight&gt;
 //Paste your code here
&lt;/vue-code-highlight&gt;

全局引入
import VueCodeH.]]></description><category></category></item><item><title><![CDATA[Axios 学习笔记--基础用法、并发请求、拦截器、封装]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/109773770</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/109773770</guid><author>hellenYuan</author><pubDate>Sat, 27 Mar 2021 21:50:25 +0800</pubDate><description><![CDATA[axios的特性

支持Promise API
可以拦截请求和响应 （ 比如拦截授权信息等等 ）
转换请求数据和响应数据 （加密解密敏感信息）
取消请求
自动转换JSON数据（一般http返回来的数据都是String类型，然后就要JSON.parse()做个手动转换，但是axios就会自动转换成json类型。）
客户端支持防御XSRF


可以用于前端（客户端、浏览器）和nodejs后端

axios在vue中的使用


npm i axios --save


在需要的页面上import axios fr]]></description><category></category></item><item><title><![CDATA[qiankun踩坑笔记1]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/112599767</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/112599767</guid><author>hellenYuan</author><pubDate>Sat, 27 Mar 2021 21:49:28 +0800</pubDate><description><![CDATA[Application died in status LOADING_SOURCE_CODE: You need to export the functional lifecycles in xxx entry
qiankun官方回答
修改报错子项目的main.js文件

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

Vue.confi.]]></description><category></category></item><item><title><![CDATA[微服务和网关学习笔记]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/114019916</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/114019916</guid><author>hellenYuan</author><pubDate>Sat, 27 Mar 2021 21:48:33 +0800</pubDate><description><![CDATA[原来：

彻底微服务后

把混在一起的流程抽象成一个一个的微服务，并建立各自独立的数据库。
网关
各流程分离成微服务后就会有大量的接口，使得调用关系变得复杂，为了防止开发过程中调用接口问题，微服务的调用需要一个把关的东西，就是网关
网关有粒度区分，最大粒度是整个微服务一个网关，只要进入网关，微服务内部则直接调用；最细粒度是微服务内外调用都必须通过网关；这种的方案是按照业务领域将微服务分为几个区，区内直接调用，区间要通过网关。

上图中：
node是宿主机：以前的node上只有container，而k8s上加]]></description><category></category></item><item><title><![CDATA[vue3在style标签中加入lang=“scss”报错解决办法]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/114141598</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/114141598</guid><author>hellenYuan</author><pubDate>Fri, 26 Feb 2021 17:06:59 +0800</pubDate><description><![CDATA[vue3在style标签中加入lang=“scss”报错解决办法：
修改版本号，删除依赖包，重新运行npm i
"dependencies": {
	"node-sass": "^4.13.1",
    "sass-loader": "^7.3.1",
},


]]></description><category></category></item><item><title><![CDATA[微前端 qiankun 踩坑记--IE11兼容]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/113610626</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/113610626</guid><author>hellenYuan</author><pubDate>Wed, 03 Feb 2021 16:06:52 +0800</pubDate><description><![CDATA[非常非常简单，
安装几个依赖：
"core-js": "^3.6.4",
"custom-event-polyfill": "^1.0.7",
"fetch-polyfill": "^0.8.2",
"whatwg-fetch": "^3.2.0"

然后在主项目的main.js中引入下列文件：
import 'whatwg-fetch';
import 'custom-event-polyfill';
import 'core-js/stable/promise';
import 'core-js/sta]]></description><category></category></item><item><title><![CDATA[vue项目在ie报错Error in nextTick “参数无效”]]></title><link>https://blog.youkuaiyun.com/hellenYuan/article/details/113180551</link><guid>https://blog.youkuaiyun.com/hellenYuan/article/details/113180551</guid><author>hellenYuan</author><pubDate>Tue, 26 Jan 2021 15:06:30 +0800</pubDate><description><![CDATA[我的情况是：重复调用同一个接口，页面就不会再刷新，报错参数无效后点击页面任何地方都不行。
解决办法：

添加v-if , 是为了满足重新调用接口的时候子组件会重新渲染（走destroyed生命周期函数）

// 父组件.vue内
&lt;Children v-if='contentList.length&gt;0' /&gt;


给子组件手动添加销毁

// 子组件.vue文件
destroyed () {
    this.$destroy();
  },


...]]></description><category></category></item></channel></rss>