- 博客(34)
- 收藏
- 关注
RSS订阅转载 vue前端项目部署到服务器上的nginx配置
#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.
2022-02-23 10:35:51
364
原创 【vue项目的微前端】主项目和子项目的vue.config.js配置文件
子项目的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 => config.re
2022-02-21 14:29:01
755
原创 vue项目中附件下载方法封装，并提取成全局共用方法
如果项目中有多个页面用到附件下载的方法，那么可以将这个方法封装成一个全局方法，减少重复代码。在main.js同级目录下新建一个GLOBAL.vue文件，在里面可以声明很多全局共用方法。>> GLOBAL.vue<scirpt>import { fileDownload } from '../HTTP/myApis'const downloadAttachment = async (fileid, rename, type) => { await fileDo
2022-02-18 10:53:10
941
原创 Api封装实例
把axios方法封装成一个个的函数，并统一在一个文件中：>> allApis.jsimport api from './myAxios'// GETexport const getAllNavList = () => { return api({ url: '...', method: 'get' })}// GET - 带参数export const getAllNavList = (data) => { return api({ url: '..
2022-02-18 10:44:22
413
原创 根源解决node-sass下载慢的问题
使用dart-sass 代替 node-sass终端安装： 运行下面命令npm install node-sass@npm:sass或者配置 package.json"devDependencies": { "node-sass": "npm:dart-sass@^1.25.0"}
2022-02-16 18:13:13
455
原创 多个vue项目共用一个node-modules文件夹的方法
问题背景：一个目录下有多个vue项目。>> root -- my-vueproject-a -- package.json -- node-modules -- my-vueproject-b -- package.json -- node-modules...期望结果：将所有vue项目中的依赖包提取为一个>> root -- my-vueproject-a -- my-vueproject-b -- package.json -- nod
2022-02-16 17:15:19
3828
原创 [技术积累]vue中对时间的处理-时间戳、时区转换
时间戳获取 .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..
2021-09-26 17:34:38
3351
原创 i18n如何在js文件中生效
在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实
2021-08-30 11:03:17
5093
2
原创 vue状态共享除了vuex还可以用Vue.observable(obj) API
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){
2021-04-23 10:53:57
281
原创 MarkDown 超链接页面内和通过新窗口打开
跳到自己博客列表跳到自己博客列表：http://write.blog.csdn.net/postlist跳到自己博客列表跳到自己博客列表：http://write.blog.csdn.net/postlist<a href="http://write.blog.csdn.net/postlist" target="_blank">跳到自己博客列表</a>跳到自己博客列表：<a href="http://write.blog.csdn.net/postlist" t.
2021-03-27 21:53:50
445
原创 vue项目中express安装
npm i express --save全局： npm install -g express-generator运行：express -e myservercd myservercnpm inpm start
2021-03-27 21:53:12
381
原创 vue中使用＜pre＞＜code＞标签插入演示代码的高亮插件-vue-highlight的使用
npm install vue-code-highlight --save局部引入import { component as VueCodeHighlight } from 'vue-code-highlight';components:{ VueCodeHighlight, ...}<vue-code-highlight> //Paste your code here</vue-code-highlight>全局引入import VueCodeH.
2021-03-27 21:51:30
2197
原创 Axios 学习笔记--基础用法、并发请求、拦截器、封装
axios的特性支持Promise API可以拦截请求和响应 （ 比如拦截授权信息等等 ）转换请求数据和响应数据 （加密解密敏感信息）取消请求自动转换JSON数据（一般http返回来的数据都是String类型，然后就要JSON.parse()做个手动转换，但是axios就会自动转换成json类型。）客户端支持防御XSRF可以用于前端（客户端、浏览器）和nodejs后端axios在vue中的使用npm i axios --save在需要的页面上import axios fr
2021-03-27 21:50:25
416
原创 qiankun踩坑笔记1
Application died in status LOADING_SOURCE_CODE: You need to export the functional lifecycles in xxx entryqiankun官方回答修改报错子项目的main.js文件import Vue from 'vue'import App from './App.vue'import router from './router'import store from './store'Vue.confi.
2021-03-27 21:49:28
4956
原创 微服务和网关学习笔记
原来：彻底微服务后把混在一起的流程抽象成一个一个的微服务，并建立各自独立的数据库。网关各流程分离成微服务后就会有大量的接口，使得调用关系变得复杂，为了防止开发过程中调用接口问题，微服务的调用需要一个把关的东西，就是网关网关有粒度区分，最大粒度是整个微服务一个网关，只要进入网关，微服务内部则直接调用；最细粒度是微服务内外调用都必须通过网关；这种的方案是按照业务领域将微服务分为几个区，区内直接调用，区间要通过网关。上图中：node是宿主机：以前的node上只有container，而k8s上加
2021-03-27 21:48:33
150
原创 vue3在style标签中加入lang=“scss”报错解决办法
vue3在style标签中加入lang=“scss”报错解决办法：修改版本号，删除依赖包，重新运行npm i"dependencies": { "node-sass": "^4.13.1", "sass-loader": "^7.3.1",},
2021-02-26 17:06:59
2138
原创 微前端 qiankun 踩坑记--IE11兼容
非常非常简单，安装几个依赖："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
2021-02-03 16:06:52
2495
10
原创 vue项目在ie报错Error in nextTick “参数无效”
我的情况是：重复调用同一个接口，页面就不会再刷新，报错参数无效后点击页面任何地方都不行。解决办法：添加v-if , 是为了满足重新调用接口的时候子组件会重新渲染（走destroyed生命周期函数）// 父组件.vue内<Children v-if='contentList.length>0' />给子组件手动添加销毁// 子组件.vue文件destroyed () { this.$destroy(); },...
2021-01-26 15:06:30
2074
1
原创 vue从后端接口获得的数据写在created中,而不是mounted中
vue从后端接口获得的数据写在created中比较好由于之前我对vue的生命周期各个阶段没有完全搞懂，一般我会把所有的数据初始化放在mounted中，但是今天我搞懂了：created是发生在mounted之前的，template还没有被渲染成html，但是在这个阶段已经可以获取到props和data了，所以在这一个步进行数据赋值是比较恰当的.mounted 顾名思义是页面已经渲染完成了，template已经被渲染成了html，这个时候再进行数据请求，很有可能会造成页面闪屏。...
2020-12-22 11:25:00
2593
原创 vue2.x中sass的使用和全局变量的配置（详细步骤）
step1：>>>package.json中添加下面三个依赖包"dependencies": { "node-sass": "^4.11.1", "sass-loader": "^7.3.0", "sass-resources-loader": "^1.3.3",},注意版本号要保持一致，用最新版的会有莫名其妙的报错step2：// build/utils.js 中 修改scss的配置如下：return { sass: generateLoader
2020-12-07 11:19:47
732
原创 vantUI在vue2.x项目中的安装和使用
安装第一步：npm i vant --save第二步安装vant plugin：npm i babel-plugin-import -D第三步： 配置样式// vue2.x在.babelrc文件中添加："plugins":[ ["import", { "libraryName": "vant", "libraryDirectory": "es", "style": true }] ] // 如果本身有plugins了，则应该为： "p
2020-12-07 11:10:43
358
原创 jQuery学习笔记（一） 样式篇
引入jQuery只是一个js脚本库，不需要安装，只要在标签中引入就可以<script type="text/javascript" src="https://www.imooc.com/static/lib/jquery/1.9.1/jquery.js"></script>2.x版本体量比较小，去掉了兼容IE9之前的内容...
2020-11-13 16:06:36
102
原创 vue项目中markdown文件中添加链接到本地文件、下载文件
首先，文件一定要放在static文件夹下，然后用相对路径[链接文件](/static/demos/index.html)
2020-10-27 10:18:37
1853
原创 20200928前端面经
1. 用过canvas吗，描述一下；和svg的区别 canvas基础知识<canvas id="mycanvas" width="150" height="150"></canvas>// canvas标签只有width和height两个属性，不设置的话默认300*150给canvas设置宽高要用width、height属性，而不是css，否则图形会变形，（css中设置宽高，不是讲修改画布宽高，而是将300*150的画布拉伸了）// index.jslet pa
2020-10-20 15:30:26
107
原创 js中indexOf的用法
stringObject.indexOf（‘substring’, startIndex）作用：返回指定子字符串‘substring’在某字符串对象中首次出现的位置。indexOf（）大小写敏感返回值：-1 代表没有找到匹配子串0,1,2,3… 返回的是首次匹配到子串的indexstartIndex是可以省略的，省略就从index=0开始匹配。数组也可以用.indexOf()，用法同String。区别在于，字符串调用indexOf在传入子串不是String的情况下，会默认转为String；而
2020-10-09 10:07:37
2296
原创 vue npm run build--report报错Cannot find module ‘archiver‘（vue面试题）
最近看到一道关于vue cli的面试题，vue cli常用的npm指令有哪些？除了npm installnpm run devnpm run build之外，题主还给出了一个npm run build --report这一指令的作用是返回打包后的各个静态资源文件的大小，可以清晰地看到哪个文件过大，以便于进行优化，提升项目速度。我尝试跑这一指令的时候，发生了报错：Error: Cannot find module 'archiver'解决：先安装一下缺失的模块，再重新跑一下就可以了
2020-09-08 17:15:47
1506
1
原创 cloud.callfunction调用云函数update，result为null，无法修改db
文件 cloudfunctions/update/index.js 在 project.config.json ‘cloudfunctionRoot’ 指定的目录, 如果不希望在小程序/小游戏的运行环
2020-08-26 10:35:43
566
1
原创 小程序自定义组件，放在miniprogram文件夹下还是报错Component is not found...
解决方案： 1）使用公众开放平台注册的小程序（非开发工具上的“小程序”，“小游戏”，demo）根据AppID 打开会自动创建cloudfunctions ; mineprogram 目录，新建 component 需要在 mineprogram目录下创建，不可以与mineprogram同级一定要删掉，重新在miniprogram下新建components...
2020-08-26 10:14:53
1741
原创 vue动态拼接style字符串 - 根据得到的response数据来改变横条、进度条长度
<div class="innerbar" :style="{width:+ item.resumes + '0%'}"></div>
2020-08-04 14:13:18
1129
原创 echart-条形图各个属性详解/bar渐变色/根据value设置bar的颜色/隐藏刻度线/给每一个bar添加阴影/tooltip自定义样式
echart-条形图各个属性详解horibarOption:{ grid: { left: '0px', right: '20px', bottom: '3%', containLabel: true, x:130 }, tooltip: { trigger: 'axis', formatter: function(pa
2020-08-04 14:05:52
2043
原创 微信小程序自定义头部适配，不同机型高度--学习笔记
微信小程序自定义头部学习笔记首先看一下在不同机型上自定义头部高度效果（黄色部分）：首先给需要自定义头部的页面文件夹下的json（index.json或xx.json）文件添加：这一步的目的是把自定义的头部去掉，给我们自己写的头部腾出位置。{ "navigationStyle": "custom" // 将navigationStyle从默认default改为custom}in...
2020-05-06 11:15:13
4739
原创 用event bus解决vue中无法监听到this.$slots.default变化的
用event bus解决vue中无法监听到this.$slots.default变化 （包含去除$slots.default中的空白节点this.$slots.default关于event bus代码实现this.$slots.defaultvue官网中提到：default property 包括了所有没有被包含在具名插槽中的节点。也就是说可以通过$slots.default获取到通过...
2020-04-26 17:29:28
4131
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人