- 博客(97)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 single-spa结合vue项目初探
single-spa结合vue项目初探本次案例以vue-element-admin为例，验证single-spa的可接入性。根据single-spa的官网介绍，推荐将项目的所有文件（包括图片和css）等文件全部打包入一个js文件。但是这样我们原来的分包等打包优化都会变得没有意义，那么为什么要全部打入一个包呢？因为single-spa的接入是以入口js文件接入的，而不是入口html文件，这样一来就会导致一些资源加载路径的错误，从而导致无法正常显示，但也并不是完全不可以。下面将一步步一起尝试。安装依赖我
2020-07-03 18:26:19
2541
4
转载 css加载与阻塞
css加载会阻塞DOM树的解析渲染吗？用代码说话：<!DOCTYPE html><html lang="en"> <head> <title>css阻塞</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <style>
2020-06-28 17:28:17
501
原创 使用Node脚本对前端国际化（二）
以locals文件夹下面存放国际化文件为例，我们将zh存放中文为例，下面将演示遍历所有中文文件，并进行翻译，翻译后生成到对应的文件夹下，保持和中文目录下的一致的目录结构。目录结构如下├── index.js├── translate-core│ ├── google-translate.js│ ├── index.js│ └── string.js└── translate-helper.js在使用Node脚本对前端国际化初探已经做了翻译API，的封装，本次将上次内容放到tra
2020-06-14 23:55:45
679
原创 使用Node脚本对前端国际化的处理初探
针对前端国际化做的一些探索，借助谷歌翻译的API进行核心的翻译工作，通过node将文本写入文件完成文件的替换工作
2020-06-09 23:45:51
470
原创 带你用Node了解JSONP实现原理
1、JSONP是什么，解决了什么问题JSONP 指的是 JSON with Padding。由于跨域政策，从另一个域请求文件会引起问题。从另一个域请求外部脚本没有这个问题。JSONP 利用了这个优势，并使用 script 标签替代 XMLHttpRequest 对象。——w3cWeb页面上调用js文件时不受是否跨域的影响（不仅如此，我们还发现凡是拥有src这个属性的标签都拥有跨域的能...
2020-03-22 13:38:08
288
转载 JS命名规范
ECMAScript 规范中标识符采用驼峰大小写格式，驼峰命名法由小(大)写字母开始，后续每个单词首字母都大写。根据首字母是否大写，分为两种方式：Pascal Case 大驼峰式命名法：首字母大写。eg：StudentInfo、UserInfo、ProductInfoCamel Case 小驼峰式命名法：首字母小写。eg：studentInfo、userInfo、productInfo标...
2019-11-06 22:15:54
332
转载 Vue 开发规范目录及说明
本文档为前端 vue 开发规范规范目的命名规范结构化规范注释规范编码规范CSS 规范规范目的为提高团队协作效率便于后台人员添加功能及前端后期优化维护输出高质量的文档命名规范为了让大家书写可维护的代码，而不是一次性的代码让团队当中其他人看你的代码能一目了然甚至一段时间时候后你再看你某个时候写的代码也能看普通变量命名规范命名方法 ：驼峰命名法命名规范 ：命名...
2019-11-06 22:13:55
1031
原创 prop 的 sync修饰符与自定义指令v-model
prop 的 sync修饰符允许我们通过prop进行双向数据绑定而不触发子组件修改props的警告使用方式如下子组件 Nam.vueprops:{ name:{ defalut:'x', type:String}}methods:{ changeName(){ this.$emit(update:name,somevalue)// Tip：update字段是必...
2019-10-06 19:21:02
776
转载 闭包内存泄露问题
反思闭包一、我理解的闭包二、先举几个例子三、为什么要使用闭包？四、闭包的弊端五、闭包为什么会导致内存占用过多？六、内存占用和内存泄漏七、反思一、我理解的闭包有权访问另一个函数作用域中局部变量的函数。创建方式，就是在一个函数内部创建另一个函数，通过另一个函数访问这个函数的局部变量。概念都是这么一说，细节问题到是不少，下面我们细说一下。二、先举几个例子1.实现局部变量累加const sum...
2019-08-07 21:58:06
1146
原创 关于动态换肤的解决方案
关于动态换肤的解决方案最近在学习electron，希望在页面切换的时候动态更换背景色，也是参考了一个知名软件的效果，让我手痒起来，也想实现以下，之前在用element开发的时候接触到过换肤的一些思路，但是当时并没有这块的需求，也就搁置了，下面个跟大家探讨以下我的两种思路。效果图方式一 动态增加link标签所谓动态增加link标签就是在需要换肤的时候，把需要更改的颜色进行关键字替换，把新生成...
2019-07-18 21:31:24
1392
翻译 关于Add(2)(3)问题
关于Add(2)(3)问题首先，add(2)(3)用JavaScript 实现首先，如果我们做一个简单的分析，我们可以简单地说这不仅仅是针对JavaScript的问题，而是可以用任何具有First Class功能的语言实现。当该语言中的函数被视为与任何其他变量一样时，编程语言被称为具有第一类函数。例如，在这种语言中，函数可以作为参数传递给其他函数，可以由另一个函数返回，并可以作为值赋值给变量...
2019-07-17 23:11:57
867
原创 electron 控制台打印乱码问题
在控制台打印时中文乱码问题。问题原因是因为字符编码的问题，Windows下输入chcp,可以查看到当前字符编码，如果大家经历过asp时代的话，就知道：每个asp页面代码的顶部，都必须定义一个数字表示的字符集。而常见的gb2312的值是936，utf8的值是65001解决办法修改package.json文件"start": "chcp 65001 && electron-f...
2019-07-08 21:32:02
8256
原创 iview安装使用以及遇到的问题汇总（持续更新）
安装：npm install iview --save引入：1.全局引用import Vue from 'vue';import iView from 'iview';import 'iview/dist/styles/iview.css' //iview的样式文件，必须引入Vue.use(iView);2.按需引入// 在需要的地方按需引入import Vue from...
2019-06-11 21:13:05
5456
原创 vue项目打包发布页面空白以及图片加载错误问题
在执行npm run build 之前，需要先更改配置，避免打包出来是空白的问题找到config->index.jsbuild: { // Template for index.html index: path.resolve(__dirname, '../dist/index.html'), // Paths assetsRoot: path.reso...
2019-05-22 20:31:04
434
原创 Vue项目中封装axios请求方法(包括请求拦截)
本篇文章将对项目中如何封装axios常用的请求方法进行介绍，其中包括最容易出问题的post请求的解释，包括一些请求格式和参数格式不一致问题的解决；通用配置这些配置是在axios官方文档中没有列出来的，主要是post方法的内容类型的定义，不配置的话经常会出现请求提交失败或者数据没有正常提交的问题，这些一般都是前后端采用的post的数据格式不一致导致的。axios.defaults.timeo...
2019-05-22 20:25:10
9461
1
原创 Vue2.0 子组件修改props中的值导致问题及报错解决
vue 父组件给子组件的prop传值报错Avoid mutating a prop directly since the value will be overwrittenwhenever the parent component re-renders. Instead, use a data orcomputed property based on the prop’s value. P...
2019-04-13 21:35:45
7249
1
原创 Git常用命令
git add 把文件添加到仓库git commit -m 将文件提交到仓库git status查看当前仓库状态（哪些被修改过，或者修改没提交等）git diff 查看文件修改内容git log显示从最近到最远的提交日志git log --pretty=oneline用简洁的方式看git log（输出的大串数字为sha1加...
2019-04-01 23:25:43
129
转载 移动端 touch 滑动事件
移动端触屏滑动的效果其实就是图片轮播，在PC的页面上很好实现，绑定click和mouseover等事件来完成。但是在移动设备上，要实现这种轮播的效果，就需要用到核心的touch事件。处理touch事件能跟踪到屏幕滑动的每根手指。以下是四种touch事件touchstart: //手指放到屏幕上时触发touchmove: //手指在屏幕上滑动式触发touchend: ...
2019-02-27 15:52:33
5439
4
转载 rem与em的使用和区别详解
编者：在自适应制作稿中，我们经常会看到rem和em这两个单位的冒泡，rem是基于html元素的字体大小来决定，而em则根据使用它的元素的大小决定（很多人错误以为是根据父类元素，实际上是使用它的元素继承了父类的属性才会产生的错觉）·你可能已经很熟练使用这两个灵活的单位，但你可能不完全了解何时使用 rem ，何时使用 em。 本教程将帮你弄清楚!Em 和 rem都是灵活、 可扩展的单位，由浏览器转...
2019-02-27 12:59:16
1436
转载 JS三座大山：原型与原型链，作用域及闭包，异步和单线程。
原型与原型链说到原型，就不得不提一下构造函数，首先我们看下面一个简单的例子：function Dog(name,age){ this.name = name; this.age = age;}let dog1 = new Dog("哈士奇",3);let dog2 = new Dog("泰迪",2);首先创造空的对象，再让 this 指向这个对象，通过 this...
2019-02-26 11:24:06
1356
转载 初探浅拷贝&深拷贝
思考这个代码为什么具有深拷贝作用obj = JSON.parse(JSON.stringify(deepCloneObj));浅拷贝与深拷贝在JavaScript中，对于Object和Array这类引用类型值，当从一个变量向另一个变量复制引用类型值时，这个值的副本其实是一个指针，两个变量指向同一个堆内存中的对象，改变其中一个变量，另一个也会受到影响。这种拷贝分为两种情况：拷贝引用和拷贝...
2019-02-24 22:27:38
124
转载 ES6三点(...)扩展运算符
扩展运算符将一个数组转为用逗号分隔的参数序列console.log(...[a, b, c]) // a b c用于：1 将一个数组，变为参数序列 let add = (x, y) => x + y; let numbers = [3, 45]; console.log(add(...numbers))//4...
2019-02-24 22:18:43
161
转载 BFC（Block Formatting Context）基础分析
W3C官方对于BFC的描述只有3小段，强烈建议想理解BFC的朋友先去看看，链接见文末。常见的文档流分为：定位流、浮动流、普通流3种。BFC是普通流中的一种。本文提出3个问题并给出使用BFC来解决这些问题的方法，这3个问题是：外边距折叠（Collapsing Margins）让一个没有设置高度的容器包含浮动元素阻止文字环绕什么是BFC根据W3C对BFC的描述，可以总结出：BFC是一...
2019-02-24 21:20:49
145
转载 用 Hexo 搭建博客
这会是一篇很长的教程。其实，介绍 Hexo 在 Github 上搭建博客的教程汗牛充栋，之所以还要继续这一项重复的工作，主要是我心中对理想的技术博客文章有两点期盼：技术博客不仅仅是操作手册，不仅要告诉读者如何做，还要告诉读者为何要这么做；消除神秘性，在博客文章中给出的信息都应该提供参考资料，且最好是官方文档，信息的准确性不会经过 N 手转述而打折。这一篇文章，是我的一次尝试。本文一共 6...
2019-02-20 12:38:29
2931
原创 Git将本地文件夹添加到远程仓库
$ git initInitialized empty Git repository in C:/Users/****/Desktop/video-addLinklist/.git/$ touch readme.md$ git add readme.md$ git commit -m "add link address"[master (root-commit) 3c4f724] ad...
2019-02-20 10:52:05
15954
转载 内存中堆和栈的区别
在说堆和栈之前，我们先说一下JVM（虚拟机）内存的划分：Java程序在运行时都要开辟空间，任何软件在运行时都要在内存中开辟空间，Java虚拟机运行时也是要开辟空间的。JVM运行时在内存中开辟一片内存区域，启动时在自己的内存区域中进行更细致的划分，因为虚拟机中每一片内存处理的方式都不同，所以要单独进行管理。JVM内存的划分有五片：寄存器；本地方法区；方法区；栈内存；堆内存。我们重...
2019-02-19 16:39:41
19616
2
原创 module.exports与exports，export与export default之间的关系和区别
首先我们要明白一个前提，CommonJS模块规范和ES6模块规范完全是两种不同的概念。CommonJS模块规范Node应用由模块组成，采用CommonJS模块规范。根据这个规范，每个文件就是一个模块，有自己的作用域。在一个文件里面定义的变量、函数、类，都是私有的，对其他文件不可见。CommonJS规范规定，每个模块内部，module变量代表当前模块。这个变量是一个对象，它的exports属...
2019-02-19 00:20:58
3028
1
原创 手写Ajax实现以及Axios实现
ajax并非一种新的技术，而是几种原有技术的结合体。它由下列技术组合而成。1.使用CSS和XHTML来表示。2 .使用DOM模型来交互和动态显示。3.使用XMLHttpRequest来和服务器进行异步通信。4.使用javascript来绑定和调用。Ajax的原理简单来说通过XmlHttpRequest对象来向服务器发异步请求，从服务器获得数据，然后用javascript来操作DOM而...
2019-02-16 18:53:53
4033
原创 ES6 let 和 var 的区别
ES6 let 和 var 的区别1.let声明的变量不存在变量提升，但是存在“暂时性死区”（temporal dead zone，简称 TDZ）。2.let不允许在相同作用域内，重复声明同一个变量。3.let作用域为代码块（每个花括号范围内为一个作用域），而var 的作用域分为函数内声明和全局两种let命令ES6 新增了let命令，用来声明变量。它的用法类似于var，但是所声明的变...
2019-02-16 18:33:48
2646
转载 网页分享如何展示标题，描述，缩略图
在页面head标签中按如下设置 <meta itemprop="name" content="标题名称"/> <meta itemprop="image" content="图片地址，最好写成http形式"/> <meta property="og:image" content="图片地址，最好写成http
2019-01-29 23:08:38
7651
转载 Linux 下安装pip
安装pip使用脚本安装和升级pip要安装或升级pip，需要下载 get-pip.py. 地址：https://bootstrap.pypa.io/get-pip.py运行以下命令进行下载安装 (需要管理员权限):$ wget https://bootstrap.pypa.io/get-pip.py$ python get-pip.py$ pip -V #查看pip版本https:...
2019-01-26 00:05:05
5608
2
转载 linux环境下安装geckodriver
Redhat自带火狐，所以不需要在下载一遍浏览器第一步下载 geckodriverwget https://github.com/mozilla/geckodriver/releases/download/v0.22.0/geckodriver-v0.22.0-linux64.tar.gz各个版本的driver下载地址如下https://github.com/mozilla/geckod...
2019-01-26 00:00:36
9088
转载 解决“selenium.common.exceptions.SessionNotCreatedException: Message: Unable to find a matching set ...
selenium 启动firefox浏览器时，报错：selenium.common.exceptions.SessionN otCreatedException: Message: Unable to find a matching set of capabilities原因：如果出现如上信息，说明firefox浏览器版本和浏览器驱动版本不匹配。我环境:firefox49.0.2版本 g...
2019-01-26 00:00:06
16637
原创 Python+Selenium 实现打开浏览器、定时刷新页面
直接上代码，可能会出现的问题以及解决办法在下面给出# coding = utf-8import timefrom selenium import webdriver# driver = webdriver.Firefox() 打开火狐浏览器driver = webdriver.Chrome() # 打开Chromedriver.maximize_window() #最大化...
2019-01-20 22:53:37
10828
2
原创 python3报错bs4.FeatureNotFound: Couldn't find a tree builder with the features you requested: lxml.
报错信息： bs4.FeatureNotFound: Couldn’t find a tree builder with the features you requested: lxml. Do you need to install a parser library?解决：bs4调用了python自带的html解析器，python3貌似是没有html解释器，所以会报错。只要给python3安...
2019-01-20 21:54:42
3205
原创 Could not find a version that satisfies the requirement urllib2 (from versions: )No matching distrib
python3 pip install urllib2安装错误Could not find a version that satisfies the requirement urllib2 (from versions:)No matching distribution found for urllib2因为在python3中已经将2.x版本的urllib和urllib2两个库合并为一...
2019-01-20 21:37:06
21798
3
原创 Flex 布局实现元素的垂直居中和水平居中
更多关于flex布局可以参考这篇博文：https://blog.csdn.net/qq_34803821/article/details/85139315使用flex实现元素的水平居中和垂直居非常方便水平居中：.box{ display: flex; justify-content: center;}垂直居中 .box { display: fle...
2019-01-14 21:01:30
17173
原创 页面中图片大小自适应问题，避免留白
第一种：div 包着 imgimg {width: auto;height: auto;max-width: 100%;max-height: 100%;}第二种：背景图片style="background-image: url(${user.headimgurl});background-size: cover; "下面是background-size 的各个属性 ：...
2019-01-11 22:00:40
3678
原创 使用python+flask实现树莓派的WEB控制
如果你想在网页上点击按钮，并且让树莓派接收到响应，并做响应的处理，实现网页上与树莓派进行数据交互以及一些数据渲染，那么希望这篇文章对你有所帮助：源码放在git,有需要的同学可以留言首先先看效果图，总体效果我会放在文章末尾这是已经写好的HTML页面，我截取了其中一部分，当我们点击蓝色按钮，树莓派打开Arduino板上的风扇，点击红色按钮关闭风扇然后是树莓派做出的相应，接收到我的点击事件，并...
2019-01-10 16:59:13
12580
3
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人