我做这个的目的是为了如何在vue组件渲染之前修改slots中的内容，来改变动画状态，解决vue产生_leaveCb的问题

上篇文章已经搭建了最基本的项目，我用手机下载了一个版本62.点开头的chrome apk来测试。 果真白屏，啥也没有，也看不到报错信息。 赶紧安装 vconsole ，重启，刷新，依然白屏，连vconsole也没有。这可咋弄。 想了下，这浏览器老的是可以呀，还得修改编译参数，加大es5的处理。 根目录有一个配置文件 .browserslistrc 里面的配置如下

先使用vue-cli搭建一个纯洁的vue2库。导入Photo-Sphere-Viewer-main 核心包，这是一个最简单能跑起来全景图的配置。在APP.vue中开始写简单的全景代码

ProvidePlugin可以做一些全局的东西，也可以作为polyfill的替代品

怎么用nuxtjs一个项目开发多个网站，完美利用所有公共组件与资源

现在再uniapp使用vue3怎么样了，应不应该转

最终我发现这个乱码问题不好解决，得改许多东西，如果网页不是自己的，最好不要使用这种方案，网页是自己的得严格要求网页格式

使用nuxt3 vite vue3技术，搭建项目全过程，里面用到很多知识点和开源工具。

Eslint编写代码过程中检测代码，主动检测代码问题，git提交中检测大妈问题

每次安装node-canvas都报错，安装不成功，这次记录下来

ios手动添加 pod 'react-native-amap3d', path: '../node_modules/react-native-amap3d'解决问题

集成react-nativ-webview,出现这样的错误"RNCWebView" was not found in the UIManager

接下来讲一下啊继承react navigation遇到的问题

chrome.webRequest redirect data-URLs

这个错误事chrome浏览器升级到94版本后出现的

windows下安装emscripten需要python、git环境

不用 Vuetify 也可以用 vuetify-loader 哦

原因是不能解析async … await 等高级语法

添加VueCompositionAPI解决

import data from 'static/h5Static.json'

后来发现是vue和vue-template-compiler版本不一致导致的，重新下一个同版本包就可以了

但是我选择了vue-style-loader

no such file or directory, open 'C:\Users\me\AppData\Local\Temp\prebuild.tar.gz'

单独安装core-js依赖

禁用cnpm，cnpm的坑

所以通过这次使用，我确定了，一定要禁止使用cnpm，npm和yarn也要只用一个。

提起 npm，大家第一个想到的应该就是 npm install 了，但是 npm install 之后生成的 node_modules 大家有观察过吗？package-lock.json 文件的作用大家知道吗？除了 dependencies 和 devDependencies，其他的依赖有什么作用呢？接下来，本文将针对 npm 中的你可能忽略的细节和大家分享一些经验 。

yarn config set proxy http://127.0.0.1:8080

推荐使用~，只会修复版本的bug，比较稳定

Add the following to your nuxt.config.js file under the build section.

通过配置opition的url属性，来配置预览大图的url

通过配置opition的url属性，来配置预览大图的url

通过配置opition的url属性，来配置预览大图的url

使用grid来控制X轴Y轴文字被遮挡的问题

让x轴字体倾斜 设置dataZoom滚动条 可以控制坐标轴分割间隔

另外，基于Date类型valueOf()的特征，我们可以对两个日期进行比较大小：

sequelize 默认情况下， 保存日期时会转换成 +00:00时区，

下面的代码是一个C函数，实现简单的字符串拼接，然后返回拼接的字符串。

在日常研究中，我们经常碰到大量JavaScript代码，我们首先要深入分析才能了解这些代码的功能及具体逻辑。这些代码代码可能会被恶意注入到页面中，可能是客户送过来需要我们帮忙分析的脚本，也可能是我们的安全团队在网页上找到的引用了我们服务的某些资源。这些脚本通常代码量不大、经过混淆处理，并且我们总是需要经过多层修改才能继续深入分析。

In puppeter you have access to the session cookies through page.cookies(). So once you log in, you could get every cookie and save it in a json file:

原理是先获得本机chrome的cookie，然后再设置给Puppeteer

page.setRequestInterception(true)拦截器的使用方法和场景 现附上Puppeteer的Api的链接https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md

在使用puppeteer自动化的过程中，会发现其实开启的chrome往往自动禁用了插件功能，如果我们想在自动化测试的过程中，再去使用一些常用的插件提升效率（偷懒）的话，就行不通了，其实解决办法还是有的，我们今天就来讲解这个问题。

通过node-open模块，可以在任何平台上打开某个浏览器网址。

使用Fiddler时如何屏蔽Chrome的证书警告："Your connection is not private"/"您的连接不是私密连接"（如图1所示）？ 启动chrome的时候加上--ignore-certificate-errors命令行参数（如图2所示）即可。

消息队列（Message Queue，简称MQ），从字面意思上看，本质是个队列，FIFO先入先出，只不过队列中存放的内容是message而已。 其主要用途：不同进程Process/线程Thread之间通信。

消息队列已经逐渐成为企业IT系统内部通信的核心手段。它具有低耦合、可靠投递、广播、流量控制、最终一致性等一系列功能，成为异步RPC的主要手段之一。当今市面上有很多主流的消息中间件，如老牌的ActiveMQ、RabbitMQ，炙手可热的Kafka，阿里巴巴自主开发RocketMQ等。

解决方法：对目标元素设置固定高度（或宽度）

因为你错误的使用了 <nuxt>标签。 你应该使用 <nuxt-child keep-alive > </nuxt-child> 因为上层已经使用过了 <nuxt></nuxt>标签。

CSS3 box-shadow 属性用来描述一个元素的一个或多个阴影效果，该属性几乎可以让你完成你想要的任何阴影效果。然而 box-shadow 属性语法和取值非常灵活，对于新手有点不容易理解。今天总结一下语法和 box-shadow 属性各种阴影效果。

其实对于box-shadow，老白我也是一知半解，之前用的时候直接复制已有的，也没有仔细思考过box-shadow的数值分别对应什么，最后导致阴影的边如何自由控制，苦于懒人一个一直没有正式去学习，今天无意中看到以下这篇文章，瞬间清醒有木有，看完整片文章，对于box-shadow阴影四个边的设置完全了如指掌了，再也不怕修改box-shadow了！

​[contenteditable]:focus{outline: none;}

app.use(express.json({limit: '50mb'})); app.use(express.urlencoded({limit: '50mb'}));

我测试的100万一下，都是秒级的。 3000万也就卡那一下。

但我们可以使用Css before选择器来实现完全相同的效果

spellcheck输入完某个单词后,进行按空格键，就可以看到这是不是错误的单词了。

map-get($map,$key) 函数的作用是根据 $key 参数，返回 $key 在 $map 中对应的 value 值。如果 $key 不存在 $map中，将返回 null 值。此函数包括两个参数：

mjml如何快速编写响应式电子邮件

nuxt.js 列表界面分页加载后进入详情页，返回上一页如何让界面不重新加载

下面这个方法已经失效了，我写在这里是劝退大家使用163邮箱的

无论是在 desktop, mobile or web哪一方面，Cache都常被我们用来提升程序性能。当处理web应用程序的时候，虽然可以使用当前所有浏览器都支持的响应头来进行客户端缓存，从而提升页面加载效率。但当一个内容非常繁杂的页面需要2s来进行HTML输出的时候，即使启用客户端缓存该页面，服务器仍然需要针对每一个来访用户进行页面渲染。想想一个大型的新闻门户网站首页，难道他们要针对每一个用户一遍又一遍地处理HTML吗？

anyanyproxy --clearproxy --clear

Electron 可以让你使用纯 JavaScript 调用 Chrome 丰富的原生的接口来创造桌面应用。你可以把它看作一个专注于桌面应用的 Node.js 的变体，而不是 Web 服务器。其基于浏览器的应用方式可以极方便的做各种响应式的交互，接下来介绍下关于 Electron 上衍生出的框架 Nightmare

pick()和omit()函数

关于nuxt.js的资料并不是很多，有时候遇到个很简单的问题，百度或者谷歌都不是很容易找到。 其实这个问题就很简单，但是也让我浪费了很多时间，所以在此共勉。

application/json设置无效的解决办法

对于iOS或是Android来说，我们可以将相关的算法通过C/C++进行编写，然后编译为dylib或是so并进行混淆以此来增加破解的复杂度，但是对于前端来说，并没有类似的技术可以使用。当然，自从asm.js及WebAssembly的全面推进后，我们可以使用其进一步增强我们核心代码的安全性，但由于asm.js以及WebAssembly标准的开放，其安全强度也并非想象中的那么美好。

Asm.js: Javascript的编译目标

这个输入文件file，既可以是clang可以编译的C/C++语言，也可以是二进制形式的llvm bitcode或者人类可读形式的llvm assembly文件。

The Emscripten Compiler Frontend (emcc) is used to call the Emscripten compiler from the command line. It is effectively a drop-in replacement for a standard compiler like gcc or clang.

C/C++代码通过emcc编译为字节码，然后根据不同的目标编译为asm.js或wasm。emcc和gcc编译选项类似，例如-s OPTIONS=VALUE、-O等。另外为了适应Web环境，emcc增加了一些特有的选项，如–pre-js 、–post-js 等。

Emscripten实现把C/C++文件转成wasm，wast（wasm的可读形式）,llvm字节码（bc格式），ll格式（llvm字节码的可读形式）的步骤。

flex： 将对象作为弹性伸缩盒显示 inline-flex：将对象作为内联块级弹性伸缩盒显示

用正则去除粘贴带的html标签

paste事件就是粘贴事件 需要通过clipboardData获得粘贴的内容

button下的index.jsx编译为当前目录下的index.js grid下的index.jsx编译为当前目录下的index.js

主要原因是，我每次刷新玩，都复制一下右键，然而并没有出现菜单，一度颓废啊，因为demo，还有其他人的文章都是这样的。 哎，后来发现是这样的，我缺少了contexts选项。其实我是成功了，我现在只要不选择文字，直接点右键，菜单已经出现了哦。

严格来讲，我们正在说的东西应该叫Chrome扩展(Chrome Extension)，真正意义上的Chrome插件是更底层的浏览器功能扩展，可能需要对浏览器源码有一定掌握才有能力去开发。鉴于Chrome插件的叫法已经习惯，本文也全部采用这种叫法，但读者需深知本文所描述的Chrome插件实际上指的是Chrome扩展。

短ID在实际运用中很广泛， 其中比较典型的运用就是短地址。 市面上肯定有不少开源的生成短ID库， 基于node.js的估计也不少。 鉴于本人已然是node.js的脑残粉(本职java开发), 很多业余项目从前端到后端都基于javascript开发， 加上npm和bower的包管理以及grunt的打包工具， 在项目开发过程中体验特别酸爽。 由于当时项目前后端都会用到短ID， 但没找到合适的库同时支持npm和bower的(可能孤陋寡闻). 因此自己乐此不疲地又造了个轮子js-shortid(夷，为什么会说又呢?!). 下面主要介绍它的实现方案， 自认为比较优雅简洁。

Nodejs通过账号密码连接MongoDB数据库

NodeJS操作 Mongodb 并且对 Mongodb 类库进行封装

npm install -g typescript

注：第1、2种方法均是借助 babel，需要注意的是文章使用的babel版本 < 7。从 babel 7.X 版本开始，部分包名、用法发生了些许变化，大体与7之前的用法类似，详细请到官方手册学习 7.X 版本的改动（Babel 踩坑总结(三) —— 7.X 版本升级是我对 7.X 版本三大改动的总结）

typescript提示implicitly has an 'any' type，这个怎么解决？

"module": "CommonJS",

node中模块导入require是一个内置的函数，因此只有在运行后我们才可以得知模块导出内容，无法做静态分析

npm install --save form-data

node 中没有实现 fetch，你可以使用 node-fetch，使得在 node 中也可以使用 fetch.

npm install -g typescript

cnpm config set python python2.7 cnpm config set msvs_version 2015

The specified container does not exist，

​let date = new Date(); date.setHours(date.getHours() + 8);

babel-plugin-transform-remove-console，更加灵活的控制console

js使用console.log在console中打印信息影响性能吗

对于前端开发人员，在开发过程中经常需要监控某些表达式或变量的值，如果使用用 debugger 会显得过于笨重，最常用的方法是会将值输出到控制台上方便调试。 最常用的语句就是console.log(expression)了。

注意事项 参数是headers 不是header

然后nodejs 调用daoffmpeg的命令。zhuan ​ 可以获得视频的时长shu duration 和 分辨率1653 272X480 。

html video audio 连续播放视频音频

在实际项目开发中可能会碰到在 a.com 页面中嵌套 b.com 页面，这时第一反应是使用 iframe，但是产品又提出在 a.com 中操作，b.com 中进行显示，或者相反。

注：iframe.contentWindow这里，返回的是iframe的window对象，所以后面可以接着调用document方法，再接着调用getElementByTagName。那么就可以对iframe里面的元素进行操作了。

matchMedia() 返回一个新的 MediaQueryList 对象，表示指定的媒体查询字符串解析后的结果。 matchMedia() 方法的值可以是任何一个 CSS @media 规则 的特性, 如 min-height, min-width, orientation 等。 MediaQueryList 对象有以下两个属性：

Map对象长度是用size，不是用length

W3C上有明确关于mediaSource 扩展接口的文档。mediaSource 扩展文档中是这么定义的， 它允许JS脚本动态构建媒体流用于和，允许JS传送媒体块到H5媒体元素。这种接口的应用可以让h5播放器实现持续添加数据进行播放。做as的朋友都知道as中的appendBytes方法,一种添加二进制数据进行播放的方式。这两种接口在概念上是类似的。只是里面的定义和对媒体文件的要求有所不同。对于mediaSource扩展接口我只介绍我们主要应用的几个。

server发送视频流的二进制数据给web，web通过webRTC的dataChannel发送给其他web用户。再通过MSE将二进制数据转换成视频流播出。

Media Source Extensions（媒体源扩展）大大地扩展了浏览器的媒体播放功能，提供允许JavaScript 生成媒体流。这可以用于自适应流（adaptive streaming，也是我毕设的研究方向）及随时间变化的视频直播流（live streaming）等应用场景。

节约带宽，减少缓冲时间，提升服务质量，处理峰值流量, 视频观看的人越多，播放越流畅。

热门emoji表情符号大全

Rocket.Chat推送消息 Rocket.Chat是一个开源实时通讯平台, 支持Windows, Mac OS, Linux. 支持聊天, 文件上传, 视频通话, 语音通话功能. 向Rocket.Chat推送消息 以下示例可以转为别的语言的版本, 本示例使用Linux平台的curl测试, curl非常强大. 登陆 首先需要登陆Rocket.Chat服务器

WebTorrent是第一个运行在浏览器的Torrent客户端。是的，没错。就是浏览器! 它完全是用JavaScript编写的，并使用WebRTC实现了真正的点对点传输。不需要浏览器插件、扩展或安装。 使用开放的Web标准，WebTorrent将网站用户连接在一起，形成一个分布式的、分散的Browser-to-browser网络，以实现高效的文件传输。

我觉得自适应好点，详情看文章

pm2 show www-server

Escape a string for use in HTML or the inverse

正在寻找某个大版本的最新版？ Node.js 10.x Node.js 8.x Node.js 6.x Node.js 4.x Node.js 0.12.x Node.js 0.10.x 所有版本

1.从卸载程序卸载程序和功能。 2.重新启动（或者您可能会从任务管理器中杀死所有与节点相关的进程）。 3.寻找这些文件夹并删除它们（及其内容）（如果还有）。根据您安装的版本，UAC设置和CPU架构，这些可能或可能不存在：

1、node.js、nvm、 npm （1）在cmd中输入`where node`找到node长须所在位置进行删除 （2）确保计算机-环境变量删除相关引用 （3）在cmd中输入`node -v` ，得到以下结果，删除成功

解决 Module build failed: Error: ENOENT: no such file or directory错误

npm重启解决一切问题，npm疑难杂症，清空npm包缓存

其实nodejs实现队列的方式又很多中，也有很多开源的插件和队列数据库可以使用，但是呢，如果我们一个简单的项目，完全可以使用redis来实现队列， 这样再不增加技术难度的同事，我们也就可以完美的实现一个队列

当前市面上mq的产品很多，比如RabbitMQ、Kafka、ActiveMQ、ZeroMQ和阿里巴巴捐献给Apache的RocketMQ。甚至连redis这种NoSQL都支持MQ的功能。 ActiveMQ ActiveMQ是apache出品，最流行的，能力强劲的开源消息总线，并且它一个完全支持JMS规范的消息中间件。其丰富的API、多种集群构建模式使得它成为业界老牌消息中间件，在中小型企业中应用广泛。

其中StartConsumer 会在项目启动时启动，在整个生命周期中一直保持监听状态，在程序结束时mq的链接关闭。需要注意的是 noAck 这个参数，当为false是表示消息出队后不会自动删除，如果设置成true,则无论消息处理成功与否此消息会被删除。注意到在消息不成功是，调用了ch.nack(msg))，此方法是将消息重新入队。

以前做项目碰到发邮件的需求，邮件模板的编辑就是一件头疼的事。因为虽说邮件是支持 HTML 的，但是确是 HTML 子集程度的支持，所以存在必须通过 <table> 排版的恶心之处，还有很多兼容性的坑。本质上是各家邮件商的标准有差异吧。

mjml 是一个很不错的响应式邮件html 内容标签库，email-templates 是一个灵活强大的邮件发送框架，两者集成起来我们 可以设计灵活强大的邮件发送系统，以下是一个简单的集成使用，实际使用还有好多地方需要完善

因为multipart这种形式比较复杂，因此要利用boundary分割符，将邮件体分割成不同段来进行解析，boundary分为父段和子段，父段一般出现0次或1次，出现在末尾，每个子段中也有content-type和boundary，需要在进行解析，如果遇到i,iii里面的情况可直接解析，如果遇到ii中的情况，再按ii中的步骤进行解析

我原本从intellij idea转换到visual studio是因为webstorm没办法远程开发，而visual studio有remote wsl，和remote ssh，看着挺不错的样子。

在日志输出 的后面添加上回车符号就能实现日志单行输出了

微软开发了一个VSCode的插件Remote-SSH，可以说是目前比较完美的解决了在windows下开发linux程序的问题。

很多时候，我们需要同时向后端进行多个请求，当所有请求都返回数据后，再进行一些操作。

参考地址 Vue FLIP简单实现及理解 vue-flip翻转组件的 demo Vue Flip​

虽然不知道vue flip是干啥的，先记录下吧，以后可能会排上大用场哦。

这个文章对于列表动画讲的横详细，顺便介绍下这个网站本身，https://cssanimation.rocks/又好多好看的动画展示哦

vue修改滚动条，平滑移动，下拉加载，上拉刷新，统统这里都有

比如 vuetify中的 input组件，就用到了fieldset做边框， 这个时候我们想改边框，却找不到border，因为fieldset是靠color来修改边框颜色的。

throttle 节流，debounce防抖

nuxt引入jQuery库 nuxtjs如何添加 Webpack 插件？

Meteor本质上是一个已经公开了连接 http服务器的节点应用程序，这意味着您可以像下面这样定义服务器路由：，如果您坚持使用Express，则可以将Express路由注册为Connect中间件，如下所示：

enter, enter-active, enter-active-to, (开始 进入阶段的)第1帧 属性值，到 (默认属性值 的过渡阶段)，移除enter动画， leave, leave-active, leave-active-to (开始 离开 阶段的)第1帧 默认属性值，到 (属性值 的过渡阶段)，移除leave动画

网络号，真是太爽了，真的，如果又了好的网络，开发真是事半功倍，所以，大家开发前，一定要把自己的网络给整好。 会给你节省不少时间呢。

1. get和set是方法，因为是方法，所以可以进行判断 2. get一般是要返回的；而set是设置，不用返回 3. 如果调用对象内部的属性约定的命名方式是变量名前加_

beforeunload，event，浏览器窗口，关闭，刷新

validator 用于接收来自父组件的数据（子组件期待获得的数据）

vue添加全局Toast和Confirm

webapp或者移动端网页需要嵌入到app时候，尤其是在APP内置的webView上加载我们的页面，想要查看手机浏览器信息是非常困难的事，当出现问题的时候，你又不能查看日志，一般会连接本地测试环境，然后在alert来打印日志

例如，将路由为'/proxy'的请求转发至‘www.google.com’：则可用下列语句实现

路径为绝对路径，当项目的域名为二级域名的时候，就不能打包为这绝对路径了。 nuxt不同于vue项目，思索了许久，终于找到了配置的地方

用nodejs开发WebAssembly

从最初使用webdriver+selenium爬虫到现在利用http请求解析html，经历过各种各样的问题，webdriver+selenium这种办法虽然万能，而且可以用JS写解析脚本方便调试，

asm.js 就是为了解决这两个问题而设计的：它的变量一律都是静态类型，并且取消垃圾回收机制。除了这两点，它与 JavaScript 并无差异，也就是说，asm.js 是 JavaScript 的一个严格的子集，只能使用后者的一部分语法。

一、1. HTTP 请求中的来源识别 二、2. 数据加密 三、3. 数据签名 四、4. 时间戳 五、5. AppID 六、6. 参数整体加密 七、7. 限流 八、8. 黑名单 九、1. 压缩 十、2. 混淆 undefined、3. 加密

WebAssembly 以及通过 AssemblyScript 的扩展，不会使每个网站都神奇地变得更快，但是这并不重要。 WebAssembly 之所以令人兴奋，是因为它可以使更多的应用在 Web 变得中可行。

自从 JavaScript 诞生起到现在已经变成最流行的编程语言，这背后正是 Web 的发展所推动的。Web 应用变得更多更复杂，但这也渐渐暴露出了 JavaScript 的问题：

抓包调试工具 常规加密分析流程 常用解混淆代码手段 解决Eval打包

目录 前端js常见混淆加密保护方式 eval方法等字符串参数 emscripten WebAssembly js混淆实现 JSFuck AAEncode JJEncode 代码压缩 变量名混淆 字符串混淆 自我保护，比如卡死浏览器 控制流平坦化 僵尸代码注入 对象键名替换 禁用控制台输出 调试保护，比如无限Debug,定时Debug 域名锁定

随着组件的细化，就会遇到多组件状态共享的情况， Vuex当然可以解决这类问题，不过就像 Vuex官方文档所说的，如果应用不够大，为避免代码繁琐冗余，最好不要使用它，今天我们介绍的是 vue.js 2.6 新增加的 Observable API ，通过使用这个 api 我们可以应对一些简单的跨组件数据状态共享的情况。

不知道为啥，现在idea的取色工具怎么都不好使了，给开发人员反映过，都一年了有没修复咋地。 网上搜到一个取色工具，把图片传上去，就可以点击取色。不错。

如果再结合activity不销毁，隐藏的方法，像里面传递参数，来改变页面，不销毁webview，我发现这样比原生的都要快。这样又能用于app端，又能生成小程序，何乐而不为

android在mainfest中给Activity添加一个属性 android:theme="@android:style/Theme.Dialog",可以使Activity悬浮在其它窗口上面，在布局中可以设置activity的大小，当点击悬浮Activity边缘以外区域时，Activity会消失，观察消失时其生命周期会发现执行了finish()方法从而执行了onDestroy方法。有时我们只是需要将Activity隐藏，并不销毁，此时可以重写finish方法,如下：

这个网站，我们可以通过拖动到方式，来生成邮件模板。

我们现在估计用table布局最多的地方也就是发送邮件的服务，用来布局邮件布局了。 这个时候我们需要吧table的间隙变成0。

如何从后台访问接口，向Rocket.Chat推送消息

Object.entries()方法返回一个给定对象自身可枚举属性的键值对数组，其排列与使用 for...in 循环遍历该对象时返回的顺序一致（区别在于 for-in 循环还会枚举原型链中的属性）

1.子向父，子postMessage,父监听message; 2.父向子，父postMessage,子监听message; 3.测试发现，子向父postMessage的时候，源可以写为‘*’，父向子postMessage的时候，源需要写成子的源，(也就是子页面的协议+主机号+端口) 测试代码部分：

vuex，state，批量，vue，react

在新建的js文件中想用store里面的数据，比如token想在封装的axios里面，请求头里面去使用，亦或者通过app的JS接口获取token并存储在store里面。我们都知道如何在vue中如何使用。

Meteor中国镜像，离线安装，package复制

当没有任何参数时,run是默认行为,在幕后,它3000端口开启node.js服务器实例,同时开启监听3001端口的MongoDB服务

Mac解决：xcode-select: error: command line tools are already installed, use "Software Update" to install updates

LRU（Least recently used，最近最少使用）算法根据数据的历史访问记录来进行淘汰数据，其核心思想是“如果数据最近被访问过，那么将来被访问的几率也更高”。

computed 从vuex获得数据，watch监听数据 然而问题就出现在了监听上，监听不到，给个setTimeOut 1000 就能检测到数据了，不然打印时又数据，用的时候时空的，不知道时什么原因。

将文本复制到剪贴板应该不难。配置它不需要几十个步骤，也不需要加载数百KB的js文件 。但最重要的是，它不应该依赖Flash或任何臃肿的框架。这就是clipboard.js存在的原因。

其实这并不是一个错误，这是一个提醒，网上又很多也遇到这样问题的，但并不是和我的一样。

npm 与 yarn命令比较

show:true,//显示策略，默认值true,可选为：true（显示） | false（隐藏） text: '主标题',//主标题文本，'\n'指定换行 link:'',//主标题文本超链接,默认值true target: null,//指定窗口打开主标题超链接，支持'self' | 'blank'，不指定等同为'blank'（新窗口） subtext: '副标题',//副标题文本，'\n'指定换行 sublink: '',//副标题文本超链接

在vue项目中解决Chrome控制台non-passive event listener输出问题

作为一个假的前端，在调试一个页面时出现了如下bug。 左侧的菜单固定为fixed时，二级菜单无法设置有效的z-index，导致菜单隐藏在页面元素之下，明明页面元素的z-index是1，但是无论把菜单的z-index设置为多大，都不管用。

你可能会想，这不就是个简单的函数声明？没错，这个函数就是一个类的定义的实现。如何使用这个类呢？看下面的代码：var cls1 = new MyClass(); 这样，利用new就可以生成MyClass的一个实例了。所以在js中可以说函数就是类，类就是函数。

它可以解释成为“匿名函数自调用”，也就是说，定义一个匿名函数，然后马上调用它（因为它是匿名的，如果不立即调用就获取不到该函数的引用了）。通常它被应用在一些大型的JS框架中（如上面所说的），因为这个匿名函数的函数体相当于提供一个匿名的名字空间，这样就不会再与用户自定义的JS函数、变量、对象发生冲突了。尽管JS没有显示地提供命名空间的定义和使用机制，但这种匿名方式却不失为是一种很好的解决命名空间问题的方法。

prototype是函数的一个属性，并且是函数的原型对象。引用它的必然是函数，这个应该记住。

通过filter的属性进行去重， 因为map key唯一，所以你想要根据哪个属性去重，res.has(a)里a就可以改成什么，比如a.name

js递归遍历树结构（tree）

遇到这样的问题，一般是props中的pagination有值不匹配造成的 我们可以通过打印数据检测一下有没有赋给其空值

返回的数据里没有名为key的键值，所以需要在组件上设置这个表是以什么作为key来区别每一行数据的。

一般是因为在watch中改变所监听的数据

我们后期可以封装成vue的

inline svg是目前前端图标解决方案的最优解（当然不仅限于图标），而且使用方式也及其简单，只要将svg图标代码当成普通的html元素来使用即可

groupBy可以实现按id分组了。

transform-origin是变形原点，也就是该元素围绕着那个点变形或旋转，该属性只有在设置了transform属性的时候起作用

指定与元素相关联的命名空间URI的字符串。创建的元素的namespaceURI属性使用namespaceURI的值进行初始化。 参见有效的命名空间URL。

发生这样的情况只是一个warn，但是我们又强迫症的怎么解决这个问题呢？

js最简单的排序

凡是需要滚动的地方都加一句scroll-behavior:smooth就好了！

之前我们为大家分享过很多款各式各样的CSS3开关切换按钮，很多还是非常富有创意的，比如这里的多组超具创意的CSS3开关切换按钮和纯CSS3灯光开关动画。今天我们要带来另外一款外观很漂亮的纯CSS3开关切换按钮动画，它模拟了电灯的开关，并且在开和关之间切换时按钮的背景会有不同的变化，看起来非常不错。

两个场景（即两个div视图）切换的时候，如果想添加个过渡动画，除了可以使用js来实现，还可以通过CSS3的animation属性来实现。 （注意：Internet Explorer 9 以及更早的版本不支持 animation 属性。）

Jquery 动态交换两个div位置并添加Css动画效果

vue如何使用js进行锚点跳转

js定位大全获取节点的兄弟，父级，子级元素含robot实例

为什么我获取到的aDiv.style.width的值为空

在操作页面滚动和动画时经常会获取 DOM 元素的绝对位置，例如 本文 左侧的悬浮导航，当页面滚动到它以前会正常地渲染到文档流中，当页面滚动超过了它的位置，就会始终悬浮在左侧。

delete 只适用于删除对象属性

text/html与text/plain有什么区别

​这个插件可以很好的实现跑马灯，以及轮播图等效果，scrollBox js

setAttribute() 方法添加指定的属性，并为其赋指定的值。 如果这个指定的属性已存在，则仅设置/更改值

document.querySelector(selector).style.styleName = 样式 使用这个方法可以对dom节点添加和移除style样式，其中的styleName可以为css样式的任何值，如：display、color

我们只需把@import改成<style src=""></style>引入外部样式，就可以解决样式是全局的问题

flex布局左右两边固定，中间自适应

超大屏，1100分辨率，880分辨率,720分辨率,440分辨率以下

给角色添加权限，根据自己需求，可以添加无数个，最重要的是添加AliyunSTSAssumeRoleAccess，可以搜索添加。

当点击目标事件的时候，目标事件下的目标元素，增加class，这样就实现了动态添加class。

当获得click的当前元素的时候，获得的是其子元素的当前元素，这应该怎么解决啊？

css自己也又很多变量哦，大家还要多多学习哦。CSS中的变量很有用，因为它们允许我们写更多DRY（不再自我重复，也就是不需要一直写重复内容的代码）代码。它们对于管理和维护大型项目也有非常好用，因为它们包含了大量重复的值。

以前我们在如何动态设置伪元素的颜色上非过不少心思，看完下面的文章，你就会超级见到那的设置伪元素的颜色了。

使用 svg-sprite-loader 和 自定义 VUE组件 来处理svg图标icon

将一下文件拷贝至服务器目录/app |名称|描述| |-|-| |.nuxt|编译后生成的目录,开发模式和发布模式通用,注意发布前使用npm run build 防止将dev目录发布| |static| 静态资源文件,通过/可直接访问| |package.json|npm 包管理配置文件| |nuxt.config.js|Nuxt.js 默认的配置涵盖了大部分使用情形，可通过 nuxt.config.js 来覆盖默认的配置。| |node_modules|依赖模块|

非常简单的功能，但nodejs没有提供。但不要绝望因为nodejs可以调用系统命令，而系统命令中有不少可以操作剪切板的命令，由于系统是windows，所以考虑使用windows cmd命令中的clip，来实现复制到剪切板的功能。

点击上面地址，我们可以看到一个灵活的css气泡，拖动按钮，改变气泡效果。

CSS 函数

对元素进行移动、缩放、转动、拉长或拉伸。 方法：translate(): 元素从其当前位置移动，根据给定的 left（x 坐标） 和 top（y 坐标） 位置参数 有两个div，它们的css样式如下，transition:过渡 元素从一种样式逐渐改变为另一种的效果 有一个div，它的css样式如下：

打开这个连接，你会发现很多按钮动画脚本，基本这些动画就够大家用的了。

1.EaseIn：即缓动发生在入口处，也就是刚开始的时候。 2.EaseOut：即缓动发生在出口处，也就是结束之前。 3.EaseInOut：就是两边都有缓动了.

用于滚动窗口（类似于window.scrollTo(x, y)）或DOM元素（如myDiv.scrollTop = y; myDiv.scrollLeft = x;）。滚动窗口时使用window作为动画目标。

动画关键词：CSS（一般可以省略） CSSPlugin用于在TweenMax中对DOM元素的CSS相关属性进行动画 在CSSPlugin中CSS属性需要写成驼峰式，例如font-size应当写作fontSize。有时候你可以在一些默认px为单位的属性中省略单位，CSSPlugin还可以在不同的单位间做动画：

TimelineMax是GreenSock 动画平台中的动画组织、排序、管理工具，可创建时间轴（timeline）作为动画或其他时间轴的容器，这使得整个动画控制和精确管理时间变得简单，避免了通过反复delay和回调进行动画。 作者：李霖弢 链接：https://www.jianshu.com/p/8c0361e43bf5 来源：简书 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

TweenMax.js集成了GreenSock动画平台的大部分核心功能,且具有极高的兼容性。

vue中is的属性引入是为了解决dom结构中对放入html的元素有限制的问题，譬如ul里面要接上li的标签，引入is的属性后，你完全可以写成这样

运动效果 实例化对象.set() 立刻运动到指定地点，不用加时间

简单来说，CSS 滤镜就是提供类似 PS 的图形特效，像模糊，锐化或元素变色等功能。通常被用于调整图片，背景和边界的渲染。本文就会围绕这些滤镜展开，看看具体能怎么使用或者玩出什么花活。

GSAP(GreenSocks Animation Platform)是一个性能较好的前端动画库。最近在写一个前端SVG动画编辑器时选择了它作为底层的动画库。为了减少踩坑，我大致浏览了它的源代码，这篇文章主要是对我的理解进行记录。 我会先简单介绍一下这个动画库的API，再介绍它的插件机制，最后会从一个用例出发跟踪其运行机制。

这个博客有大量的css内容，有svg，TweenMax等教程，抽空通读一下

前端修炼场，首页标签大全greenSock前端研究VUE研究我们的作品flash技术探讨开发心得个人档案培训与招聘服务报价

简单点的 我们可以用iframe加载图片来破解防盗链，也可以通过后台获取图片

在TypeScript项目中直接引入Javascript包是不能使用的，因为包中缺少TypeScript类型声明，如果是自己写的包，可以考虑自己增加一个.d.ts类型声明文件，如果代码比较多或者使用的是第三方的包，自己写就比较麻烦了。第三方的包首先考虑找一个别人写好的声明文件，如果没有可以使用一些自动生成声明文件的工具。

nodejs至今仍然不支持ES6标准的import引用，所以发布的npm包不能直接用import，即使你是用import写的，最后发布的时候也要转成commonjs规范的代码，一个模块只发布的源码没有发布commonjs规范的代码，直接怼作者就行了。

在 ES6 之前，社区制定了一些模块加载方案，最主要的有 CommonJS 和 AMD 两种。前者用于服务器，后者用于浏览器。ES6 在语言标准的层面上，实现了模块功能，而且实现得相当简单，完全可以取代 CommonJS 和 AMD 规范，成为浏览器和服务器通用的模块解决方案。

try catch，await ，axios

为什么import和require能混合使用，不出问题

相信大家都曾用caniuse网站查询过css、js的一些兼容性问题，并且都从它反馈的兼容性数据中获益，让我们的线上项目更加稳定、和谐的跑在用户电脑里。不过对于caniuse页面上的一些细节，我们可能会感到困惑或者模棱两可，今天就带着大家一起来重新认识caniuse这个网站，并对它的原理和细节做些探究。

IDEA实现正则批量替换

package.json 有很多字段，也有很多官方字段，我们需要知道他们的具体是做什么的才能很好的运用

TypeScript 是 JavaScript 的超集，扩展了 JavaScript 的语法，因此现有的 JavaScript 代码可与 TypeScript 一起工作无需任何修改，TypeScript 通过类型注解提供编译时的静态类型检查。 TypeScript 可处理已有的 JavaScript 代码，并只对其中的 TypeScript 代码进行编译。

自从开始使用 Node.js 已经一年多，写的代码越多，越是觉得自己提高的越慢。想来应该有没有将单一功能的代码封装在一个独立模块，而导致代码稍微多一点就维护困难的原因。

首先想到去看CSS3有没有什么属性可以实现，后来被我找到了text-stroke 　 　　该属性是一个复合属性，可以设置文字宽度和文字描边颜色 　 　　 该属性使用很简单：text-stroke:1px #f00;（1px是文字宽度，#ff是文字描边颜色）

在Node.js中，res的响应头Header中的 Access-Control-Allow-Origin 属性不能匹配除 (*) 以外的正则表达式的，域名之间不能也用逗号分隔。也就是说， Access-Control-Allow-Origin 的属性值只允许设置为单个确定域名字符串或者 (*)。

nodejs express中设置请求头允许跨域 设置请求头允许跨域请求 app.js 文件中添加 代码

跨域是个比较烦，比较难解决的问题，如果有什么跨域问题，可以直接找我。

Element 是一个通用性非常强的基类，所有 Document 对象下的对象都继承自它。这个接口描述了所有相同种类的元素所普遍具有的方法和属性。一些接口继承自 Element 并且增加了一些额外功能的接口描述了具体的行为。例如， HTMLElement 接口是所有 HTML 元素的基本接口，而 SVGElement 接口是所有 SVG 元素的基础。大多数功能是在这个类的更深层级（hierarchy）的接口中被进一步制定的。

因为 Vue 的东西相对比较多，所以它的 API 我们完整的过一遍之后，才能真正的知道 Vue 到底有哪些功能。

当浏览器访问服务器并发送第一次请求时，服务器端会创建一个 session 对象，生成一个类似于 key,value 的键值对，然后将 key(cookie)返回到浏览器(客户)端，浏览器下次再访问时，携带 key(cookie)， 找到对应的 session(value)。 客户的信息都保存在 session 中

aes加密简单来说，在密码学中又称Rijndael加密法，是美国联邦政府采用的一种区块加密标准。这个标准用来替代原先的DES，已经被多方分析且广为全世界所使用。高级加密标准已然成为对称密钥加密中最流行的算法之一。

ret = CryptoJS.AES.encrypt(data,'secret key 123') content = ret.toString() result = CryptoJS.AES.decrypt(content,'secret key 123') print(result.toString(CryptoJS.enc.Utf8))

Inkscape中的终极工具是XML编辑器(Shift+Ctrl+X)，可以实时显示整个文档的XML树形图。修改绘图时，你可以注意一下XML树形图中的变化。也可以在XML编辑器中修改文本、元素或者节点属性，然后在画图上查看效果。这是一个非常形象化的学习SVG格式的交互式工具。并且可以实现一些通常的编辑工具无法完成的功能。

本教程演示了Inkscape基础使用。这是常规Inkscape文档，你可以预览、编辑、复制、保存。 本教程包括画布导航、管理文档、形状工具基础、选择技术、使用选择转换对象、分组、设置填充和画笔、对齐和Z顺序。有关更高级的主题请查看帮助菜单中的其它教程。

导航栏内，平均分为四块，为了适配各种移动设备，使用了flex布局。 与此同时，产品经理要求：页面上滚越过封面图时，导航栏变为固定定位，浮在页面顶部。 拿到需求之后，思路就是先搞好布局，然后监听window.onscroll，当页面滚的距离大于封面图的时候，给ul加入position：fixed。

Vue 框架通过数据双向绑定和虚拟 DOM 技术，帮我们处理了前端开发中最脏最累的 DOM 操作部分， 我们不再需要去考虑如何操作 DOM 以及如何最高效地操作 DOM；但 Vue 项目中仍然存在项目首屏优化、Webpack 编译配置优化等问题，所以我们仍然需要去关注 Vue 项目性能方面的优化，使项目具有更高效的性能、更好的用户体验。本文是作者通过实际项目的优化实践进行总结而来，希望读者读完本文，有一定的启发思考，从而对自己的项目进行优化起到帮助。本文内容分为以下三部分组成：

话说网上发送邮件的代码很多，但是我由于不细心，导致拿别人的代码发送邮件老是失败，今天就说说几个要注意的地方吧！！！

由于服务器配置了Nginx的反向代理，在ExpressJS中无法获取到真实的IP地址。本文就介绍了如何配置Nginx以及ExpressJS使其可以显示用户的真实地址。

有时候我们需要获得动态的元素，但是我们没法直接用vue语法，vue一共了当前组件的对象，我们可以避免使用document.get...之类的。

属性名必须以VUE_APP_开头，比如VUE_APP_XXX

用Vue，extend，做一个全局组件

Intellij IDEA,解析less，css

vue中并没有 @hover 事件，但是可以使用 @mouseenter 和 @mouseleave 来模拟hover操作。

transition: property duration timing-function delay transition属性是个复合属性，她包括以下几个子属性： transition-property ：规定设置过渡效果的css属性名称 transition-duration ：规定完成过渡效果需要多少秒或毫秒 transition-timing-function ：指定过渡函数，规定速度效果的速度曲线 transition-delay ：指定开始出现的延迟时间

我们用vue的底层方法options，可以解决很多问题。但是这个时候调用方法，this指向会发生很大的变化，会很影响我们的预期，我们可以给方法指定this

本节介绍两个 Vue.js 内置但却不常用的 API——extend 和 $mount，它们经常一起使用。不常用，是因为在业务开发中，基本没有它们的用武之地，但在独立组件开发时，在一些特定的场景它们是至关重要的。

npm 发布指定文件

js 获取鼠标位置

vue-cli是开发vue项目必不可少的脚手架工具，3.0版本之前的目录结构是由config目录的，关于webpack配置的文件都放在该目录里面，而3.0版本之后做了一个大更新，webpack相关的默认配置都帮你集成到webpack的npm 包里面去了，官方提供的一种修改配置的方式就是开发者自己在项目的根目录（与src同层级的目录）下建立一个vue.config.js的文件，然后去覆盖自定义的配置，达到你想要的效果，下面写一个基本的默认配置

js的map、filter的用法

npm publish，报名不要驼峰式

npm run xxxx 是 node常用的启动方式之一，本文介绍下如何用PM2来实现该方式的启动。 下面是项目的package.json文件部分代码：

node，公网iP，nuxtjs

import 和 require 是JS模块化编程使用的，是前端开发者们在性能探索中的又一大进步。

下面我们用三种方式实现课程表

信息显示层，div应该放在body里面，这是我放在body中的一个div里面的div

最近接到一个任务，就是在既存用electron-vue开发的桌面端程序上追加随鼠标移动的动画效果，之前一直使用angular和react，没怎么接触过vue，先做一个vue的简单例子，然后再整合。

随鼠标移动的动画效果，之前一直使用angular和react，没怎么接触过vue，先做一个vue的简单例子，然后再整合。

首先要说，methods,watch和computed都是以函数为基础的，但各自却都不同 而从作用机制和性质上看,methods和watch/computed不太一样，所以我接下来的介绍主要有两个对比： 1.methods和(watch/computed)的对比

产生问题的原因是因为我们用的普通的点数组生成的多边形，我们应该用百度的点数组生成就没问题了。

如果开启了gzip则显示gzip，没有则是空。 上图是百度首页，显示已经进行gzip压缩。

前言.因为项目有点特殊，需要接入谷歌地图实现地理围栏，因为谷歌地图的地理围栏接口相关接口并不完善，于是就换了一个思路，利用OpenLayers来实现地理围栏 openlayers 中文地址 http://weilin.me/ol3-primer/ch02/index.html 作者：zcty0701 链接：https://www.jianshu.com/p/60e88ee1e843 来源：简书 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

可以学习下cavas下如何使用百度地图

Canvas基于百度地图绘制流动曲线

百度地图canvas自定义轨迹

入了团队才发现，该项目前后端分离，后端工程师已就位主要实现接口，IOS端工程师也已就位，还差一个web前端工程师。背脊一凉，我之前虽然写过一些js和css，虽有点功底但是离前端工程师还是有距离的啊。在和朋友说明情况后，朋友也是胆大，让我试试，主要他实在找不到人了（也有可能目前前端工程师报价都太贵了，创业嘛，能节约就节约，能理解。。。），没办法，走一步算一步吧。

随着nodejs的推出，node的并发和异步的强大能力，越来越多的得到应用，而且取得了非常不错的效果。 作为一个前端工程师对node.js自然有着一份更深的感情，跃跃欲试的心情，总希望能将它应用到产品中来。

    基于百度地图的Web API进行自定义图层叠加时，默认的图层只能叠加到全球范围以内，即经度范围为[-180, 180]，而无法将图层叠加到默认的全球范围以外，即经度范围超出了[-180, 180]之后，经纬度坐标会自动回归到(0, 0)，而导致在地图拖拽时全球以外无法连续显示想要的图层，此时可以基于百度地图的自定义图层将经纬度坐标转为像素点使用画布canvas来解决该问题。解决后效果如下图所示： ———————————————— 版权声明：本文为CSDN博主「宏伟杰作」的原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接及本声明。 原文链接：https://blog.csdn.net/u011284073/article/details/80549950

绘制围栏和编辑围栏使用高德自带的插件AMap.PolyEditor,AMap.CircleEditor,AMap.MouseTool

immediate:true,完美解决

部署nuxtjs，这一篇文章就够了，pm2 代码自动发布依赖于 git 工具，先将 ssh 密钥配置再你的代码仓库（github 或者 gitLab），具体操作自行 google 或者点击github 配置 ssh。 使用 ssh 密钥链接服务器 s $ ssh-copy-id root@1.2.3.4 # 把本机的 SSH 秘钥添加至服务器，配置成功后，以后就不需要再执行这条 SSH 命令了

添加 muted 属性，就可以通过地址栏进入网页的时候自动播放了，手机端还是有的有限制的，比如iphone浏览器，就不行，苹果手机为了保护用户的流量和用户的意愿，是禁止自动播放的，必须有手动触发。

此时需要注意顶部第一个选项，Quick Usage，一定要打开，Enable Quick Usage，谁让咱英语不好呢，这个时候会出现一个css连接，直接引用就好了，就可以随意使用图标了，引入这一个css就能实现我们的功能，省区引入太多文件的烦恼，你可以在浏览器打开这个css，可以看到里面把我们所用的文件整成base64了。所以挺好用的。

多色图标，应该是双色图标，我们需要同时用before和after等伪元素来组合出来一个双色图标。

　随着sass，less预编译的流行，css也随即推出了变量定义var函数。var()函数，就如同sass和less等预编译软件一样，可以定义变量并且进行对应的使用。

// 引入elementUIimport { Message } from 'element-ui';//由于Message组件并没有install 方法供Vue来操作的，是直接返回的，因此按照官方文档单独引入的方法是//会报错的，需要给 Message 添加 install 方法Message.install = function (Vue, options) {Vue.prototype.$message = Message}Vue.use(Message )//消息提示

vuetify中v-icon,貌似默认支持 Material Design Icons, Material Icons, Font Awesome 4 and Font Awesome 5， 我自己单独引入了vuetify 用哪一个图标都没有问题。但是用了@nuxt/vuetify只能用mdi-home这样的。不知道因为啥。肯定是封装后，封装成一个了。 但是我修改vuetify的设置，哪一个图标也都能用。哎，不过多研究了。

在icomoon和Iconfont之间我们改如何选择呢？

虽然能实现多色图标，但是缺点是只能改一种颜色。

此篇博文讲述如何利用icomoon导入图标，从而把自己想要的都通过icomoon方式进行，大家都知道，网站以及移动端，用图标还是尽量选择这种。因为直接用image有些图标会失真，从而也是前端开发之中，需求去掌握的一项，很简单的就几个步骤。

系统的话本篇是Ubuntu 16.04.6 ,centos也行，大同小异都是Linux。不过如果你是初学者，最好和我使用一样的，因为因为发行版本不同而导致的差异可能导致运行某些东西失败，找问题要找好久。windows server不推荐了，企业用的多，小服务器跑windows server比较费劲。

原来vue的双击事件如此简单，并且还有右击

如何在组件中使用异步数据？asyncData，fetch只能是page目录下使用

一、把组件的内部结构写好，写成一个vue文件notification.vue。 二、全局设置组件属性。//如果后面不需要直接引入组件的方式调用，可以不用全局注册 index.js中一般写的是需要全局设置的属性。

Vue组件化|通用组件开发——Notification通知组件封装

在过去一年里，前端开发发展迅速，前端工程师的薪资亦是水涨船高。2019 更是热度不减，而作为近年来尤为热门的前端框架，Vue.js 自是积累了大量关注。本文将为你介绍 2019 年最值得关注的 45 个 Vue.js 开源项目——Let's go!

shift() 方法用于把数组的第一个元素从其中删除，并返回第一个元素的值。

<component> 元素是vue 里面的一个内置组件。 在<component>里面使用 v-bind: is，可以实现动态组件的效果。

Vue.js如何获得兄弟元素，子元素，父元素（DOM操作）

使用electorn开发google爬虫

在使用electron-vue时候，运行npn run dev,会出现下面的错误

本样式在这个样式的基础上做了一些修改， 主要是对于表格和代码块以及一些细节的修改。 主要目的是用在chrome的扩展 Markdown Preview Plus中， 替换其内置的样式。 由于 Markdown Preview Plus对css文件大大小有要求（小于8K）， 所以需要使用压缩后的 css 文件。 当然也可以作为一个单独的markdown样式来使用。

谷歌chrome浏览器在用户登录记住密码之后通常会改变input框的背景色，这是每一个程序猿不想看到的事情，下面提出解决这个问题的方法之一

用什么代码实现？不允许有白色底色产生，因为手机高度不一样

昨天我们了解的dotenv库用于从文件中加载环境变量。环境变量用于程序运行时动态加载参数，除了环境变量，我们还可以在启动Node.js 程序时直接指定命令行参数：

可以支持读取内容为txt，为字符串

IntelliJ IDEA支持.vue文件

当执行 import vue from 'vue' 时发生了什么？

要完整介绍 PWA 是什么，需要扯一堆名词，毫无意义。 以改造公羊阅读的过程为例，简要的说明什么是 PWA。

在Nuxt.js中做PWA不分单页面和多页面，都能使用。

在 vuepress 刚出时，我就觉得这是个很值得追更的开源项目。果不其然，里面众多的前端编程技巧让我受益良多。 于是在周末这种日子里，人家追剧我追码。 今天，我就和大家分享下 vuepress 是如何做到在 Markdown 中使用 Vue 语法的。

在 vue-cli3 项目中，通过highlight.js，实现页面中代码高亮。 请先了解highlight.js官网中的使用说明。

为了实现这个功能，我最先想的是改造一个 <textarea> 然后我想到了 contenteditable (链接指向 mozilla.org) 这一属性 这是一个 html5 的属性，可以让元素内容可编辑

this.$slots.default

简单说一下业务场景，前台用户通过input输入内容，在离开焦点时，将内容在div中显示。 这时遇到一个问题，如果用户输入了html标签，则在div显示中，标签被解析。 由于是纯前端操作，不涉及后端，因此需要通过js对输入内容进行转义。

我们组装了一个contenteditable的div并且提供了v-model功能

js 正则过滤 style 行内样式 及 style 属性

使用原生JS替换节点，使用jquery进行替换节点

自动生成元素的onclick事件 event.target返回触发事件的元素 event.currentTarget返回绑定事件的元素

v-charts 图表的一些简单用法 1.v-charts修改颜色的方法

asyncData方法使得你能够在渲染组件之前异步获取数据。该方法在服务端中执行的，所以，请求数据时，不存在跨域问题。返回的数据将与 data() 返回的数据进行合并。由于asyncData方法是在组件 初始化 前被调用的，所以在方法内是没有办法通过 this 来引用组件的实例对象。

Yarn 是 Facebook, Google, Exponent 和 Tilde 开发的一款新的 JavaScript 包管理工具。就像我们可以从官方文档了解那样，它的目的是解决这些团队使用 npm 面临的少数问题.

npm、yarn下载包的源地址查看与设置成国内淘宝镜像的地址

因为早期有个项目用到了 stylus，stylus 开发起来很爽，但 stylus 基于缩进的代码在修改的时候不是很方便，加上所在团队开发使用的都是 SCSS ，为了便于维护和统一，准备将项目中的 stylus 替换成 SCSS。手动转换 stylus 浪费时间，且出错率大，当时在想也许别人也有这样的需求呢，所以就做了这样一个项目。请各位大佬动动你们发财的小手，给我点个 star，不胜感激。^_^

Sass 转换为 SCSS 需要安装的环境

IDEA在进行查看或替换的时候，勾选Regex 选项就可以进行正则匹配查找了 几个简单实用的正则：

Nuxt.js 依据 pages 目录结构自动生成 vue-router 模块的路由配置。 要在页面之间使用路由，我们建议使用<nuxt-link> 标签。

百度地图，点，线，箭头

项目需求需要利用百度地图构建路线并支持设置途径点，以及可以实时监控车辆是否偏移路线；两种方案。 写了比较完整的注释了，替换ak可直接看效果，规划驾车路线和途径点及判断车辆路线偏移

所谓的加偏，就是将真实坐标加上一定的偏移量，而这个偏移量又不是线性的，不同地区偏移不一样，但同一地区偏移量却差不多，因此，有人就使用了个暴力破解的方法，

说实在的这个解决方案有点low，我并不会很赞成，效率有点低。如果多的话，很是耗费资源。 我推荐使用矩形来解决这个问题，而不是圆形。 当日用矩形的话，就要确保轨迹是折线的，而不是弧线等。

百度地图API实时画出动态运行轨迹（一条行驶轨迹），车头实时指向行驶方向，设置角度偏移

最近在开发百度地图时，需要绘制行人行走的轨迹，并在轨迹内使用箭头表示方向，和我们平常使用百度地图导航时一样，能通过箭头表示人行走的方向。

没有后台获取事实信息 都是伪数据- -轨迹信息做不到事实导航。 控件可以根据自己的需求添加 位置通过offset：new BMAP.Size(x,y)进行微调 事实路况信息需要通过引没有后台获取事实信息 都是伪数据- -轨迹信息做不到事实导航。 控件可以根据自己的需求添加 位置通过offset：new BMAP.Size(x,y)进行微调 3D视图部分城市没有开放开放 根据需求自己添加

需求：在地图上画出围栏，设置围栏信息后保存，生成围栏列表。全选时，地图视野可看到全部的围栏区域，单独勾选会调整地图视野到当前勾选的围栏。围栏区域的中心点要显示围栏名称。

Nuxt.js 就是一个极简的 vue 版的 ssr 框架。基于它，我们可以快速开发一个基于 vue 的 ssr 单页面应用。

本文以Sass做案例，Less的参考，基本配置大同小异。 假如我们有一个Sass的全局变量common.scss文件，路径 ../style/common.scss 代码如下:

CentOS 7 使用 npm 失败 npm: symbol SSL_set_cert_cb

前段时间，一直在开发考勤系统，当时为满足设计的需求，选了好几个插件，最后决定采用Fullcanlendar的插件。感觉这个插件可以满足现阶段的功能开发需求

Who can’t relate to this: You’ve built a small portfolio page for someone, maybe a company, a friend or yourself. And the only API endpoint you’d need is one for a form. What now? Scaffolding a new service just for this one endpoint?

Fullcalendar是一款用来管理日程安排、工作计划的日历工具，它功能非常强大而且非常实用。而目前网络上没有很好的中文文档，为了更好的和大家分享Fullcalendar的相关使用，即日起计划将Fullcalendar的英文文档翻译成中文版。

createjs中包含以下四个部分： EaselJS：用于 Sprites、动画、向量和位图的绘制，创建 HTML5 Canvas 上的交互体验（包含多点触控） TweenJS：用于做动画效果 SoundJS：音频播放引擎 PreloadJS：网站资源预加载

tweenjs 是使用 JavaScript 中的一个简单的补间动画库，支持数字、对象的属性和 CSS 样式属性的赋值。 tweenjs 以平滑的方式修改元素的属性值，需要传递给 tween 要修改的值、动画结束时的最终值和动画花费时间（duration），之后 tween 引擎就可以计算从开始动画点到结束动画点之间值，从而产生平滑的动画效果。

pixi.js学习资源

移动端h5的三大抽奖方式：转盘，老虎机，翻纸牌。 前两样demo比较多，用户也审美疲劳了。这次微信公众号要抽奖，于是调研了下翻纸牌。

JavaScript利用正则表达式过滤特殊字符，关键之处是正则表达式的正确性和完整性，保证常见特殊字符都可以过滤掉。 但是，这个正则表达式有一个弊端，不能过滤掉“\”特殊字符。

在Web应用中，实现动画效果的方法比较多，Javascript 中可以通过定时器 setTimeout 来实现，css3 可以使用 transition 和 animation 来实现，html5 中的 canvas 也可以实现。除此之外，html5 还提供一个专门用于请求动画的API，那就是 requestAnimationFrame，顾名思义就是请求动画帧。 为了深入理解 requestAnimationFrame 背后的原理，我们首先需要了解一下与之相关的几个概念：

原因其实不用多说，就是利用Nuxt.js的服务端渲染能力来解决Vue项目的SEO问题。

组件是Vue.js最强大的功能之一。组件可以扩展HTML元素，封装可重用的代码。在较高层面上，组件是自定义的元素，Vue.js的编译器为它添加特殊功能。在有些情况下，组件也可以是原生HTML元素的形式，以is特性扩展。

前后端渲染，懒加载

lodash，数组去重

delete a.age;

延迟uploader.refresh。 注意如果是隐藏状态下，要在出现上传按钮端时候操作这个事。

使用npm全局安装的yarn，需要配置环境变量，将 yarn bin的地址配置到用户变量内，然后重启命令行工具就可以了 ​

push() 原生数组在末尾添加参数，返回一个新的数组

在JavaScript中生成uuid的代码如下，这个函数会直接给你返回uuid，所以直接调用，然后用变量接收即可！

localStorage作为HTML5中的新特性，它的出现可以说对于前端性能体验来讲可以获得相当大的改善。存储一些用户经常用到而又不是涉及隐私和安全的东西，的确是一个非常好的选择。下面分享一下用localStorage来处理客户端代码错误的例子来了解一下它的用途吧。

anyproxy-ca 运行这个命令，如果是mac电脑他会提醒你去通过证书。

使用vue-cli创建项目，使用webpack打包。其中，有一个webpack优化webpack.optimize.CommonsChunkPlugin，它会将node_modules中的必需模块提取到vendor文件中，项目开发中，增加第三方模块，比如element-ui、vue-echarts等，vendor的包都会增大。这个时候，就需要考虑减轻vendor包的大小，增加构建速度。我们可以使用webpack的外部扩展(externals)功能。

VUE-CLI 3.0项目使用CDN方式引用v-charts，webpack配置external，使用{"v-charts":"VeIndex"}

然后你再使用 npm run build 打包的时候，会弹出一个界面 当然了，它第一次出来的时候我立马关了，这啥玩意？？？别着急你慢慢的品，慢慢的看。 原来 这是打包后的JS，面积的大小就是体积的大小。这样我们一目了然的看到了到底那里大了

nuxt.js简单的说是Vue.js的通用框架，最常用的就是用来作SSR（服务器端渲染）.Vue.js是开发SPA（单页应用）的,Nuxt.js这个框架，用Vue开发多页应用，并在服务端完成渲染，可以直接用命令把我们制作的vue项目生成为静态html。

那缺少的elementui文件去哪里找呢？答案是cdn引用。

vue中关于插槽的文档说明很短，语言又写的很凝练，再加上其和methods，data，computed等常用选项使用频率、使用先后上的差别，这就有可能造成初次接触插槽的开发者容易产生“算了吧，回头再学，反正已经可以写基础组件了”，于是就关闭了vue说明文档。

另外，我们做路由的时候要有意的根据页面等级做出路由的长度 比如 /a是一级的页面/a/b是二级的页面，下面的文章大家也可以通过判断path的长度来计算rank值，不用有意自定了 这样做的好处有两点，一个就是前进刷新，后退不刷新，还有就是，如果我们做页面进出效果的时候也能排上用场。

transition有四个属性，很多人都会遗忘，分别是transition-property，transition-duration，transition-timing-function，transition-delay，尤其是transition-delay，这个可以实现延迟动画

当我们需要在返回上一级之前进行某些函数判断时，可以借助beforeRouteLeave 进行判断。

所有组件都需要这么去调用，就会有些许麻烦而且不太美观。像Loading、Toast等这些组件，一页面可以经常用到而且每次显示的内容都可能不一样，这样的话用js的方式【this.$xxx.show(option)】去调用就方便很多，而且代码也更整洁。

yarn upgrade 用于更新包到基于规范范围的最新版本

DOM，this.$el,vue

在Chrome中按下Ctrl+Shift+N,进入隐身模式,隐身模式会禁用所有的插件。​

同有个疑问，cdn区分开发版本和生产版本呀。怎么去动态设置呢？？

防止将某些 import 的包(package)打包到 bundle 中，而是在运行时(runtime)再去从外部获取这些扩展依赖(external dependencies)。

按照官方文档的解释，如果我们想引用一个库，但是又不想让webpack打包，并且又不影响我们在程序中以CMD、AMD或者window/global全局等方式进行使用，那就可以通过配置externals。这个功能主要是用在创建一个库的时候用的，但是也可以在我们项目开发中充分使用。

在众多的webpack配置教程中，对externals这个配置选项，总是一带而过，把文档中提到的几种方式都复述一遍，但是对于开发者而言，根本没法完全理解。本文试图通过一整篇文章，详细的对externals这个参数进行讲解。

webpack打包的体积越小，对于部署应用的网站来说，性能越好，加载速度越快。

官网文档解释的很清楚，就是webpack可以不处理应用的某些依赖库，使用externals配置后，依旧可以在代码中通过CMD、AMD或者window/global全局的方式访问。

Ant Design Pro nginx配置 今天看了下Ant和nginx的配置 给大家分享下 下边的配置可以直接使用 修改为自己的域名和文件夹目录就可以

第三方的插件，一时用着一时爽，一直用着，一直爽，但是打包之后，加载速度很慢，有时候首页加载需要四五秒，怎么办呢？除了路由按需加载之外，还有如下方法：

vue，vuex，axio，cdn

vue本身不多介绍。直接说问题，因为vue的所有路由都是加载在一个app.js里的，如果项目巨大，那么首页加载会是灾难。所以我们就需要把某些路由用异步加载(懒加载)的方式进行加载.

calc（）是css的一个函数，可用于元素计算长度，比如div宽度想要减去一个固定宽度后并自适应，可以写为calc(100% - 60px) 注意“-”两边有空格 sass已经是常用的预编译语言，允许使用变量等规则，如果上边写到60px是一个变量，这个表达怎么写呢

今天写代码的时候发现了"Uncaught SyntaxError: Unexpected token <" <html>的js错误，而且还是html的第一行，我就蒙了，这第一行有啥问题啊，还有一个“<”符号，我以为是我的网页标签没有闭包，所以检查了一下，都不是啊！错误如图。

解决办法，手动加载语言文件，提供了手动加载语言文件，避免ie下有时会因语言文件加载失败导致编辑器加载失败,提示"not import language file"的错误

使用UEditor-1.4.3中遇到第一次跳转到使用UEditor的界面后，编辑器加载正常，返回后第二次再跳转到这个界面就出现UEditor无法正常加载，

white-space: 如何处理元素中的空白，normal: 默认, 被浏览器忽略空白 pre: 空白被浏览器保留. nowrap: 文本不会换行, 会在同一行上继续, 一直走到需要换行为止 pre-wrap: 保留空白符序列, 但正常换行 pre-line: 合并空白符序列, 但正常换行 inherit: 从父元素继承white-space这个属性

父元素设置min-height子元素高度设置100%取不到值，这是因为子元素 div设置 height:100%；只有当父级元素满足min-height:1000px;设置的条件才触发；浏览器默认是不会触发的，所以子元素的100%的高度继承就失效了。min-height 是在 height 计算之后再套用的.

应该是node不支持ES6的这种模块导入导出的写法，而我们项目的工程使用了webpack。

一开始的需求是这样子的，我为了实现两个页面组件之间的数据传递，假设我有页面A，点击页面A上的某一个按钮之后，页面会自动跳转到页面B，同时我希望将页面A上的某一些参数携带过去给页面B。 然后我就想，这不就是不同组件之间的数据传递问题而已吗？直接用bus 巴士事件来传递数据不就行了吗。于是，我就很愉快地进行了。关于vue中的eventbus的使用，我之前在一篇vue中的数据传递中有提到过。

为了提高组件的独立性和重用性,父组件会通过props向下传数据给子组件,当子组件又事情要告诉父组件时用通过$emit事件告诉父组件,如此确保每个组件都是独立在相对隔离的环境中运行,可以大幅度提高组件的可维护性

由于会渲染同样的 Foo 组件，因此组件实例会被复用。而这个钩子就会在这个情况下被调用。 可以访问组件实例 `this`

很多时候，通过重置数据将页面重置时，子组件可以提供重置的方法，或者提供props重置自己的状态。但是相对麻烦，那可以使用强制刷新来实现刷新组件。

除了动态修改 $route.meta.keepAlive 还有给router-view 加key的用法， 根据自己的需求酌情处理吧

一个登录页面，只有第一次才会出现，一旦出现过，以后再也不会出现，即使是输入该页面的url也不会跳转到该页面，只会跳转到指定的其他页面；

我们可以看上一篇computed的原理，来看为什么不打印console

(Obeject.defineProperty是Object的一个方法，第一个参数是对象名称，第二个参数是要设置的属性名，第三个参数是一个对象，它可以设置这个属性是否可修改、可写等，而这篇文章主要使用的是Obeject.defineProperty的访问器属性，感兴趣的朋友可以自行google或者查看Js高及程序设计)

父元素 flex 布局，子元素有一行文字，将其设置为不换行隐藏后显示省略号，但实际并不是想象的那样，而导致布局变形。改怎么办？

flex，水平，平分

onchange触发，获取当前file对象(这里可以获取图片的大小、类型、修改时间等) reader去读取文件 塞到页面，获取图片的宽高 移出图片节点

关于vue methods不能使用箭头函数的内容如下

该用require还是import？

vue使用lodash进行开发

有两种解决办法，1.改为Es6方式，2修改.babelrcf

使用Vue的插件clipboard使用复制功能

个人推荐vue-qr，好用，还能下载二维码

非 SSL 、没域名、跨站点、IE 浏览器如何做 Cookie 共享。

父子组件交互方式多种，props、vuex、 、 emit、localStorage还有就是这个provide/inject了。它适合层级比较深的组件，比如子，子孙，子孙后代的组件有好几个用到父组件的某个属性，就可以用到这个provide/inject,它可以避免写大量繁琐的传值代码 我这里为什么要使用它？ 我一个知识库详情父组件中包含了大量的子组件，每个子组件都需要父组件的知识库ID,这时候我不想写大量props，就用到provide/inject进行传值了

在vue-router中，有两大对象被挂载到了实例this； $route（只读、具备信息的对象）； $router（具备功能的函数） 查询字符串： 去哪里 ？ <router-link :to="{name:'detail',query:{id:1}}"> xxx </router-link>

当我们在用vue ant design给select设置默认值时，如果采用v-decorator的方式去注册控件，且要对表单内容进行校验，那么这个时候无论是如下边错误1一样使用defaultValue=“2”这样来设置默认值，还是如同错误2一样使用initialValue: 2来进行设置，还是如同错误3一样使用:value="2"这样设置了值却无法注册typeId，都会设置无效或者报错等等，这个时候，如果采用setFieldsValue来对其进行赋值，就可以完好的解决该问题了。

align-items在伸缩容器上使用它，伸缩容器内部所有的元素都一致地受制于align-items的值。 但是有些时候，我们希望伸缩容器内部某个元素在侧轴上的排列方式有所差异。此时就不能使用 align-items，因为align-items作用于整体。我们希望作用于部分。这就是align-self的发挥场地。

vue-apollo的多客户端的用法以及apollo.js的配置 关于如何安装和如何使用，这篇文章就先暂时不介绍了，如果不清楚就看我另一篇关于vue-apollo的用法 在做项目中，有时候后端的接口是按模块功能去划分的，那么请求的地址就会不同，关于vue-apollo的多客户端配置如下

介绍GraphQL是什么的文章网上一搜一大把，篇幅有长有短，但是从最核心上讲，它是一种查询语言，再进一步说，是一种API查询语言。

其实在使用和学习的过程中，有很多文章都对比过它们的异同，但是大部分文章并没有从一个相对客观的角度来对比，更多是为了突显一个的优点而刻意指出另外一个的缺点。这让我想到一句话，脱离业务情景谈技术就是耍流氓。

element dialog 嵌套子dialog 不会影响遮罩

腾讯、百度、Google的地图投影均采用Web Mercator 投影坐标系；腾讯与Google的地图瓦片分辨率及切片范围是完全相同的，仅仅是命名规则稍有不同，这就使得同一位置和缩放级别的地图瓦片是完全可以重叠的；而百度地图每个缩放级别分辨率与前两者均不相同，而且地图瓦片的坐标原点做了一定的偏移，导致百度地图与前两者的瓦片是无法重叠的，这是因为百度在GCJ-02的基础上又进行了加密处理，形成了百度独有的BD-09坐标系。

我们都知道地球是圆的，电脑显示器是平的，要想让位于球面的形状显示在平面的显示器上就必然需要一个转换过程，这个过程就叫做投影（Projection）。在地球上我们通过经纬度来描述某个位置，而经过投影之后的地图也有自己的坐标系统，本篇文章就来详细介绍在百度地图API中涉及的各种坐标体系。

这篇文章实现了这个切图的功能，但是最新的百度 最高缩放等级达到19级，项目需要，无奈只能自己写个切图开发工具。 参考了同样作者的另一篇文章

搭建私服好处多多哦

如何制作文字阴影，请看正文内容

1）动画不需要事件触发，过渡需要。 2）过渡只有一组（两个：开始-结束） 关键帧，动画可以设置多个。

在浏览器中发送 XMLHttpRequests 请求 在 node.js 中发送 http请求 支持 Promise API 拦截请求和响应 转换请求和响应数据 取消请求 自动转换 JSON 数据 客户端支持保护安全免受 CSRF/XSRF（跨站请求伪造） 攻击

有时候后端小伙比较倔，跟个驴似的，非得让你穿header，就不给你放开公共资源，也只能自己研究前端下载怎么带header了，哎，下面就看咋带header。

如果没有缓存，每点击一次导航，内容区就会创建一个组件，该组件会经历整个生命周期，每点击一次，就会创建一个组件，比较浪费性能， 这时，我们就要考虑到是否能将点击过的已创建的组件进行缓存，当再次点击已访问过的组件时，这时，就会从缓存中获取该组件，而不会重新创建，

keep-alive是Vue.js的一个内置组件。它能够不活动的组件实例保存在内存中，而不是直接将其销毁，它是一个抽象组件，不会被渲染到真实DOM中，也不会出现在父组件链中。 它提供了include与exclude两个属性，允许组件有条件地进行缓存。

Vue路由开启keep-alive缓存页面，跳转时设置页面缓存

结合router，缓存部分页面

项目开发中在用户由分类页category进入detail需保存用户状态，查阅了Vue官网后，发现vue2.0提供了一个keep-alive组件。

npm unpublish仅仅在发布后的24小时内有效，假如超过了24小时，则需要连续npm官方去取消发布啦。

在Vue文件中的style标签上有一个特殊的属性，scoped。当一个style标签拥有scoped属性时候，它的css样式只能用于当前的Vue组件，可以使组件的样式不相互污染。如果一个项目的所有style标签都加上了scoped属性，相当于实现了样式的模块化。

在vue组件中，为了使样式私有化（模块化），不对全局造成污染，在style标签上添加scoped属性，以表示它只属于当下的模块。但是要慎用，因为在我们需要修改公共组件（第三方库或者项目中定制的组件）的样式的时候，scoped会造成很多困难，组要增加额外的复杂度。

开发之前先看看官网的 开发规范 我们开发的之后期望的结果是支持 import、require 或者直接使用 script 标签的形式引入，就像这样

解决方法npm publish --access public

var() var()函数可以代替元素中任何属性中的值的任何部分。var()函数不能作为属性名、选择器或者其他除了属性值之外的值。（这样做通常会产生无效的语法或者一个没有关联到变量的值。）

nuxtjs，插件开发，import，绝对路径

在项目中使用axios上传文件，记得new一个纯净的axios或者考虑用ajax请求。因为axios在项目估计已经用了全局配置请求头等信息，这里的配置可能被全局请求头拦截，导致请求失败。 2.1构造formData 作者：exmexm 链接：https://www.jianshu.com/p/9c708a47d8a5 来源：简书 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

子元素有个flex-shrink属性，表示在父元素宽度不够的情况下是自动收缩不？0表示不自动收缩，1表示自动收缩；所以将子元素（图片）添加属性：flex-shrink:0;即

更改svg颜色，重点是去掉fill属性才能自由的更改颜色

SVG图形的一个最常见用例是图标系统，其中最常用的SVG sprite技术就是使用SVG<use> 元素在文档中任意位置“实例化”图标。 使用<use>元素实例化图标或任何其它的SVG元素或图像，给元素添加样式时经常会碰到一些问题。这篇文章的目的是尽可能给你介绍一些方法来解决：使用<use>引入的内容添加样式受限的问题。 但是在开始之前，我们先快速浏览一下SVG的主要结构和分组元素，然后慢慢进入use的世界中，以及shadow DOM，然后重回CSS的怀抱。我们会逐步讲解为什么给<use>内容添加样式会比较麻烦，以及有什么好的解决方案。

虽然我们在日常开发的时候，在使用iview 或者element ui等组件时，通常会包含一些常用icon；但是在面对一些特定的需求时，或者自己想high一下，这些通用的icon并不能很好的满足我们。这个时候我们可能会拿到一些SVG适量图，但是怎么去使用这些矢量图呢。

svg-sprite-loader会把你的icon塞到一个个symbol中，symbol的id如果不特别指定，就是你的文件名。它最终会在你的html中嵌入这样一个svg， 你就可以像上面这样：

顾名思义， shadow-dom，直译的话就是 影子dom ？我觉得可以理解为潜藏在黑暗中的 DOM 结构，也就是我们无法直接控制操纵的 DOM 结构。前端同学经常用开发者工具的话，查看 DOM 结构的时候，肯定看到过下面这样的结构：

混入minxins：分发vue组件中可复用功能的灵活方式。混入对象可以包含任意组件选项。组件使用混入对象时，所有混入对象的选项将混入该组件本身的选项。

最近在做项目的时候，研究了mixins，此功能有妙处。用的时候有这样一个场景，页面的风格不同，但是执行的方法，和需要的数据非常的相似。我们是否要写两种组件呢？还是保留一个并且然后另个一并兼容另一个呢？ 不管以上那种方式都不是很合理，因为组件写成2个，不仅麻烦而且维护麻烦；第二种虽然做了兼容但是页面逻辑造成混乱，必然不清晰；有没有好的方法，有那就是用vue的混合插件mixins。混合在Vue是为了提出相似的数据和功能，使代码易懂，简单、清晰。

npm发布包步骤，以及踩过的坑（见红颜色标准）： 1.注册npm账号，并完成Email认证（否则最后一步提交会报Email错误） 2.npm添加用户或登陆：npm adduser 或 npm login

npm，cnpm，查看源，切换源，npm config set registry https://registry.npmjs.org

isToday() 判断传入日期是否为今天 isYesterday() 判断传入日期是否为昨天 isTomorrow() 判断传入日期是否为 format() 日期格式化 addDays() 获得当前日期之后的日期 addHours() 获得当前时间n小时之后的时间点 addMinutes() 获得当前时间n分钟之后的时间 addMonths() 获得当前月之后n个月的月份 subDays() 获得当前时间之前n天的时间 subHours() 获得当前时间之前n小时的时间 subMinutes() 获得当前时间之前n分钟的时间 subMonths() 获得当前时间之前n个月的时间 differenceInYears() 获得两个时间相差的年份 differenceInWeeks() 获得两个时间相差的周数 differenceInDays() 获得两个时间相差的天数 differenceInHours() 获得两个时间相差的小时数 differenceInMinutes() 获得两个时间相差的分钟数

date-fns，格式化日期

一个可以进行有损图片压缩的命令行工具和代码库。

lodash是从underscore分支的一个项目，之前我写了一篇JS模板工具underscore.template的简单用法，lodash跟underscore很相似，这也简单介绍一下lodash的template方法。 先把underscore的文章中用过的代码贴过来，把underscore的js文件换成lodash的js，其他一字不改，然后我们试试：

当网路慢的时候。又或者公司服务器不在内地的时候，接口数据请求不回来超时报错的情况相信大家肯定遇到过的，这里我把我公司项目请求超时的处理方法分享下，希望看过后有帮助。

assets中资源会webpack构建压缩到你代码中，而static文件直接引用。 static 中长存放类包、插件等第三方的文件，assets里放属资源文件比如自己资源图片、css文件、js文件。 引入资源的方式static文件夹可以使用~/static/方式引入, assets文件夹可以使用 ~@/assets 方式引入

　需求：客户在使用过程中页面报错时，可以生成错误记录传回服务器，以便改进。 　　步骤： 　　　　一.全局捕获异常， 　　　　二.发送到服务端， 　　　　三.生成错误日志。 　　一.全局捕获异常 如图，vue提供了errorHandle这个方法来处理全局异常，更多详细内容参见官网。

　需求：客户在使用过程中页面报错时，可以生成错误记录传回服务器，以便改进。 　　步骤： 　　　　一.全局捕获异常， 　　　　二.发送到服务端， 　　　　三.生成错误日志。 　　一.全局捕获异常 如图，vue提供了errorHandle这个方法来处理全局异常，更多详细内容参见官网。

nuxt.js框架中 audio标签的坑

用计算鼠标是否在图形内来判断

因为跨域请求，浏览器可能（后面讲）会发送一次options请求，如果处理不好，跨域还是会gg的。 之前很少涉及跨域，涉及也是简单请求（下面阮老师文章中区别热简单请求和复杂请求），所以基本不会很少关注options。后面就遇到坑了，下面讲讲注意点。

阮一峰大哥的文章写的不错，推荐，也推荐他的整个王章，大家可以去看一下啊。

简单请求 与 预检请求，Fetch 与 CORS 的一个有趣的特性是，可以基于 HTTP cookies 和 HTTP 认证信息发送身份凭证。一般而言，对于跨域 XMLHttpRequest 或 Fetch 请求，浏览器不会发送身份凭证信息。如果要发送凭证信息，需要设置 XMLHttpRequest 的某个特殊标志位。

html5并没有提供停止功能，我们需要通过其他方式来实现这个问题，下面我们来看下神仙般的操作。

给class属性名为className的元素添加闪烁动画效果

通过下面的语法，我们可以为不规则图形，以及过大的图形进行地图适配，更好的展示我们画的图形，当然，如果展示所有的图形，我们可以暴力的把所有的点组合起来进行展示，点过多不知道会不会影响性能，不过我们也可以从后台精简点数，不过地球是圆的，不知道好不好做。

由于组件嵌套，其实vue parent的位置也改变了，我们可以通过下面的图片，来看一下，parent到底什么哪一层

也是再做栅栏系统，搜索如何获取多边形中心点的问题上，发现了这个，简单易于理解，但是并不是特变准确，但也不影响使用。 后来发现了新的算法，并且百度地图也提供相应的api。 具体内容我写在了前面的文章，大家可以找一下。

block导致，只要父元素设置font-size：0或者设置img display: block; 便可。但是我设置了没有用，这条线不是所有的机型都有，而且页面滚动之后又消失，我琢磨半天，各种尝试，发现把图片高度减少（增加）1px就解决了。因为我们的项目是用postcss-px-to-viewport，我每张图片都是设置高度的，应该是数值转换出现偏差。

在地图上画出围栏，设置围栏信息后保存，生成围栏列表。全选时，地图视野可看到全部的围栏区域，单独勾选会调整地图视野到当前勾选的围栏。围栏区域的中心点要显示围栏名称。

如何获得百度地图的坐标范围，四个顶点坐标

利用无人机对一片区域进行测绘前，我们会先在地图上框选一个区域，然后再规划飞行的路线，而需要测绘的这片区域往往是一个多边形。在 MeshKit 中，我们加入了多边形区域的编辑功能，其中就涉及判断用户所编辑出来的多边形是否合法的问题。

在之前的 《如何判断一个多边形是否合法》 一文中有提到，用无人机规划飞行路线前，往往需要框选一个多边形的区域。 而在地图控件上显示这个多边形区域时，往往会遇到这样一个需求：需要把所要测绘的多边形区域移动到地图中心。 实现这个需求的基本思路就是：获取到多边形区域的重心点坐标，然后利用地图控件的 setCenter方法，就可以把地图的显示中心移动到多边形区域重心了。那么问题来了，如何求出一个多边形的重心点坐标呢？

下面有三种方法，我自己重点推荐第一种，毕竟这种简单粗暴好用好理解，不过这个有一个弊端，再组件嵌套组件的时候，尤其是用第三方组件里面调用自己的子组件的时候，其实已经是孙子组件了，这个时候就要parent.parent。。。。,这样就不好了，我们就得考虑其他方法了，具体怎么判断是父组件，还是爷爷组件，我会单独出一篇文章讲述。

this.$refs.test.cmethod(),vue获取子组件数据的三个方法

nuxtjs 全局变量添加 asyncData 也可访问

js神奇 lodash

首先，Vue 会将 template 中的内容插到 DOM 中，以方便解析标签。由于 HTML 标签不区分大小写，所以在生成的标签名都会转换为小写。例如，当你的 template 为 <MyComponent></MyComponent> 时，插入 DOM 后会被转换为 <mycomponent></mycomponent>。 然后，通过标签名寻找对应的自定义组件。匹配的优先顺序从高到低为：原标签名、camelCase化的标签名、PascalCase化的标签名。例如 <my-component>会依次匹配 my-component、myComponent、MyComponent。camelCase 和 PascalCase 的代码

如何用程序来绘制正多边形？ 在一般情况下，会使用 x = radius * Math.cos(angle), y = radius * Math.sin(angle) 来进行绘制，但这是关于x轴对称的，如果遇到正多边形的边数为奇数，而你又希望它是以y轴对称时，可按照下面的方法。

canvas手绘正五边形

百度地图JavaScript开源库，是一套基于百度地图API二次开发的开源的代码库。目前提供多个lib库，帮助开发者快速实现在地图上添加Marker、自定义信息窗口、标注相关开发、区域限制设置、几何运算、实时交通、检索与公交驾车查询、鼠标绘制工具等功能。

throttle 节流：drag改变浏览器大小，触发onresize函数，实现拖动每过1秒输出一次，不足1秒，1秒后输出一次。多用于高频操作，如抢票、抢购等，无论点击多少次，只固定间隔执行一次，以减轻压力。debounce防抖：drag改变浏览器大小，触发onresize函数，实现拖动停顿1秒输出。多用于输入框，当某一次输入后停顿满n秒才会去触发远程搜索。

Throttle，Debounce 就不把这两个词翻译成中文了，直接解释他们的概念。实际上这两个东西本质上是一样的，作用都是「为了避免某个『事件』在『一个较短的时间段内』内连续被触发从而引起的其对应的『事件处理函数』不必要的连续执行」。那么区别在哪呢？

一步步教你搭建hapi服务器

百度开发者平台已经封装了基于vue的地图组件，详细使用，请参考官网： https://dafrok.github.io/vue-baidu-map/#/zh/start/installation 网上有一些是直接在index.html页面全部引用的，本人强烈反对此种使用方式，因为我们项目是组件化的单页应用，强行引入多页应用的开发方式，会破坏整个项目的框架，严重影响性能。有些甚至还在vue单页应用中引入jquery，感觉这都是一些反人类的骚操作，不到万不得已，不建议使用。

Cannot read property 'gc' of undefined

※ 对于普通函数（包括匿名函数），this指的是直接的调用者，在非严格模式下，如果没有直接调用者，this指的是window。showMessage1()里setTimeout使用了匿名函数，this指向 window。 ※ 箭头函数是没有自己的this，在它内部使用的this是由它定义的宿主对象决定。showMessage2()里定义的箭头函数宿主对象为vue实例，所以它里面使用的this指向vue实例。

dispatch: 含有异步操作，commit:同步操作

Transition 可以设置 CSS 属性的过渡效果，它有以下几个属性。 transition-property 用于指定应用过渡属性的名称 transition-duration 用于指定这个过渡的持续时间 transition-delay 用于指定延迟过渡的时间 transition-timing-function 用于指定过渡的类型 transition-property transition-property 用于指定应用过渡的属性名称，可以指定多个属性名称，多个属性名称之间用, 分隔。 默认值为 all 也就是所有的元素都应用过渡效果。 例如，想让容器的宽高有一个过渡的效果，就可以这样写:

在 2.6.0 中，我们为具名插槽和作用域插槽引入了一个新的统一的语法 (即 v-slot 指令)。这篇文章主要介绍了详解vue2.6插槽更新v-slot用法总结，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

建议：打开chrome://extensions/，逐一关闭排查 以我的为例，发现罪魁祸首是以下扩展程序，最后关闭就好。

选择8月1号00:00:00后取得值为2018-07-31T16:00:00+08:00，后退了8小时，增加下面这行代码就显示正常了。

这个函数是这样的，判断当前页面的历史记录是不是小于等于1，如果小于等于1，说明这个页面没有可以返回的上一页，如果没有可以返回的上一页，就给地址栏加上一个goindex=true的参数，这样你从这个页面在往下一个页面跳转在返回，这个参数就一直加上的

1、不是为了vue写的插件(插件内要处理)不支持Vue.use()加载方式 2、非vue官方库不支持new Vue()方式 3、每一个vue组件都是Vue的实例，所以组件内this可以拿到Vue.prototype上添加的属性和方法。

Yarn 是 Facebook, Google, Exponent 和 Tilde 开发的一款新的 JavaScript 包管理工具。就像我们可以从官方文档了解那样，它的目的是解决这些团队使用 npm 面临的少数问题，即：

通过上面的内容可以知道，在slot组件中引入了slot的子组件，而且又在子组件标签内添加了新的标签内容，但页面上并没有将子组件标签内的标签内容显示出来，

首先，Vue.directive要在实例初始化之前，不然会报错，还有，定义的指令不支持驼峰式写法，也会报下面同样的错，虽然在源码中没有找到在哪里统一处理大小写，但是在有关directive的方法中捕捉到的指令命名统一变为小写,所以，还是用'-'或者'_'分割吧。

vue 自定义验证规则rule只能为数字

档所述过滤器只能用在v-bind指令和{{}}表达式中，v-model中使用过滤器是一种思维误区。 因为v-model里实现数据显示和存储格式的转换应该是双向的。如下例：

做开发的时候，每次import想要代码提示，通过../../src/components长长的相对路径用起来很不方便，通过配置webpack的alias就可以让ide实现代码自动补全功能

当混合里面包含异步请求函数，而我们又需要在组件中使用异步请求函数的返回值时，我们会取不到此返回值，如下：

混入 (mixins)： 是一种分发 Vue 组件中可复用功能的非常灵活的方式。混入对象可以包含任意组件选项。当组件使用混入对象时，所有混入对象的选项将被混入该组件本身的选项。

var preDate = new Date(curDate.getTime() - 24*60*60*1000);

百青藤，密码不合法，下面教你怎么个人注册百青藤。

在集成的服务器端框架之间进行选择: 选择您喜欢的 UI 框架: 选择您喜欢的测试框架: 选择你想要的 Nuxt 模式 (Universal or SPA) 添加 axios module 以轻松地将 HTTP 请求发送到您的应用程序中。 添加 EsLint 以在保存时代码规范和错误检查您的代码。 添加 Prettier 以在保存时格式化/美化您的代码。

​ \表示引用根目录下面的PHPEXcel;不用\的话是引用当前目录下面的 PHPExcel

~ 会匹配最近的小版本依赖包，比如~1.2.3会匹配所有1.2.x版本，但是不包括1.3.0 ^ 会匹配最新的大版本依赖包，比如^1.2.3会匹配所有1.x.x的包，包括1.3.0，但是不包括2.0.0 * 这意味着安装最新版本的依赖包

在 idea 中根据 eslint 格式化代码

最近项目用到百度额UEditor文本编辑器，今天测试向我提出了一个问题。就是在输入的文字超过默认的最大字数限制之后，虽然提示“字数超过最大范围，服务器可能拒绝保存”，但是仍然可以点击保存按钮进行保存。

consola 和 console 只差一个字母，并且它们都是控制器日志输出的好帮手。console 在某些方面，使用有些局限性。consola 是一个功能更丰富，更漂亮的控制台日志输出控件。今天我们一起来学习它的

出世的智者，入世的强者， 或者正常而阳光的普通人。

什么是 Headless CMS? 为什么 Headless CMS 带有真正的革命性？因为它严格的将内容和格式分离，使我们回归到内容管理的本源。这种变化必然会带来一些不确定性。因此，在开始您的第一个 CMS 项目之前，了解 Headless CMS 概念至关重要。因为它和传统的 CMS 有着本质的区别。

在本文中，我们将了解Headless CMS，我们将了解它的优点以及何时使用方便。此外，我们将列举实际的主要限制。为了更好地理解HCMS如何在幕后工作，我将解释如何设计和构建RawCMS，一个带有Oauth2的Aspnet.Core Headless CMS，扩展插件系统，业务逻辑支持。该解决方案可在GitHub上获得，并作为演示版在docker hub上发布。

为什么叫cms而不是框架，主要是因为他提供了一个程序员操作面板，看起来像是一个综合的后台管理，很容易误解具体项目的后台管理，他更像是一个数据库管理面板顺便完成api的自动开发操作。

主流的JS Lint工具及介绍 JavaScript已经发展蛮长时间了，对应的Lint工具也是层出不穷，下面介绍一下比较主流的几个Lint工具(其实是我用过的几个XD)

布局的传统解决方案，基于盒状模型，依赖 display属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现

硬盘的 IO 开销是非常昂贵的，硬盘 IO 花费的 CPU 时钟周期是内存的 41000000/250 = 164000 倍。 所有在一般应用中，优化要首先考虑数磁盘 IO , 通常也就是数据层的优化，说到数据库优化，很多人第一时间会想到加索引，但是什么加了索引查询会变快呢？索引要怎么加才合适呢？

如何解决node的内存溢出问题，并不是网上所说的--max-old-space-size，都能解决的。

找到开发工具中 “工具 - 设置 - 代理设置”，选择不使用任何代理即可

判断是否到了指定的深度 或者 当前数组是否已经全部展开

Boolean(value) 是把值转换成Boolean类型

在给对象参数的情况下,如果参数的形式是数组的时候,比如apply示例里面传递了参数arguments,这个参数是数组类型,并且在调用Person的时候参数的列表是对应一致的(也就是Person和Student的参数列表前两位是一致的) 就可以采用 apply , 如果我的Person的参数列表是这样的(age,name),而Student的参数列表是(name,age,grade),这样就可以用call来实现了,也就是直接指定参数列表对应值的位置(Person.call(this,age,name,grade));

最开始意识到深拷贝的重要性是在我使用redux的时候（react + redux）， redux的机制要求在reducer中必须返回一个新的对象，而不能对原来的对象做改动，事实上，当时我当然不会主动犯这个错误，但很多时候，一不小心可能就会修改了原来的对象，例如：var newObj = obj; newObj.xxx = xxx 实际上，这个时候newObj和obj两个引用指向的是同一个对象，我修改了newObj，实际上也就等同于修改了obj，这，就是我和深浅拷贝的第一次相遇。

三张图搞懂JavaScript的原型对象与原型链

JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个对象对应拥有一个原型，对象以其原型为模板、从原型继承方法和属性。而同时原型也是对象，它也拥有原型，并从中继承方法和属性，一层一层、以此类推。这种关系常被称为原型链 (prototype chain)，它解释了为何一个对象会拥有定义在其他对象中的属性和方法。

执行Generator函数会返回一个遍历器对象，也就是说，Generator函数除了是状态机还是一个遍历器对象生成函数。 返回遍历器对象，可以依次遍历Generator函数内部的每一个状态。

进过上面两种方式的对比，结果很明显，多进程处理速度是单线程处理速度的 4 倍多。而且有条件的情况下，如果电脑 CPU 足够，进程数更多，那么速度也会更快。

express不存在会阻塞请求的问题，每个请求都是一个独立的句柄，但这个应该是浏览器的策略，同样一个地址，没必要并发请求。

Express是一个基于Node.js的轻量级web开发框架，具有体积小，使用灵活等特点。查看Express的源码，如果不计供使用的中间件，主体框架只有一千余行代码，非常简练。

在我接触JavaScript（无论浏览器还是NodeJS）的时间里，总是遇到有朋友有多线程的需求。而在NodeJS方面，有朋友甚至直接说到，NodeJS是单线程的，无法很好的利用多核CPU。那么我们在使用过程中，就要非常注意性能优化了

在Java、PHP或者.net等服务器端语言中，会为每一个客户端连接创建一个新的线程。而每个线程需要耗费大约2MB内存。也就是说，理论上，一个8GB内存的服务器可以同时连接的最大用户数为4000个左右。要让Web应用程序支持更多的用户，就需要增加服务器的数量，而Web应用程序的硬件成本当然就上升了。

现在，Web开发公司和开发人员可以选择多种技术栈来构建Web应用程序。早期网络发展，不同的技术被用于前端和后端开发。但是，随着Node.js的发布，布局发生了变化，因为它允许开发人员使用 JavaScript 编写后端代码。这最终催生了MEAN（MongoDB + Express +AngularJS + NodeJS ）堆栈 web 开发框架，从前端到后端甚至是数据库（MongoDB -JSON）都使用 JavaScript。在 Node.js 之前，Web 开发通常是在 PHP 的帮助下完成的，因为它很容易与 HTML 集成，帮助开发人员立即构建动态网站。在这篇文章中，我们将比较 Node.js 和 PHP，看哪一个最适合当前的行业需求。

在进行I/O操作的时候，是将任务交给DMA来处理，请求发出后CPU就不管了，在DMA处理完后通过中断通知CPU处理完成了。I/O操作消耗的cpu时间很少.

添加elementUI 插件，plugins->ele.js,代码如下

因为一些历史原因，虽然 Node.js 已经实现了 99% 的 ES6 新特性，不过截止 2018.8.10，How To Enable ES6 Imports in Node.JS 仍然是老大难问题,下面我来介绍三种方法可以让我们在 Node.js 中使用 import/export 。

但就目前来讲，PWA是Google主推的一项技术标准，FireFox，Chrome以及一些基于Blink的浏览器已经支持渐进式Web应用了，Edge上对渐进式Web应用的支持还在开发。Apple公司也表示会考虑在自己Safari支持PWA。然而这项功能已经进入了WebKit内核的五年计划中。长期来看，对浏览器兼容性的支持方面应该已经不算太大问题了。况且在现阶段，在不支持渐进式Web应用的浏览器中，你的应用也只是无法使用渐进式Web应用的离线功能而已，除此之外的功能均可以正常使用。

Service Worker 最主要的特点是：在页面中注册并安装成功后，运行于浏览器后台，不受页面刷新的影响，可以监听和截拦作用域范围内所有页面的 HTTP 请求。 基于 Service Worker API 的特性，结合 Fetch API、Cache API、Push API、postMessage API 和 Notification API，可以在基于浏览器的 web 应用中实现如离线缓存、消息推送、静默更新等 native 应用常见的功能，以给 web 应用提供更好更丰富的使用体验。

然而rich-text有个问题，它不能够给内联img设置宽度100%，这样图片就容易溢出屏幕。我们只能在后台返回富文本的时候对图片的img标签进行格式化。或者前端进行格式化也行，我赞成使用后端，因为很多种情况我们不一定都能想得到。

安装sass并在webstorm中为scss添加watcher

有时候，我们网站的图片资源为收费资源，所以在下载之前都是有一定需求的 但是浏览器本身却有一个 “ 右键 另存为 ” 的功能

这个报错是单词写错了

@change="checked=>方法名(checked,你想传的额外参数...)"

jwplayer 隐藏属性方法记载

今天做项目中偶然误把元素加上了pointer-events属性，结果导致后来在js中给该元素加点击事件不能用，检查了半天才发现是这个属性的问题。之前没有好好研究，于是决定仔细研究一下。

今天分享一个比较实用的技巧，在实际项目中我们会经常遇到表单的input标签多选和单选的问题，但是往往由于标签自身的样式和我们项目的风格很不搭调，就不能实现了，今天就来告诉大家怎么去实现吧。

在看项目时，突然看到预览图片的弹窗，感觉好僵硬，不能放大，不能切换，于是便在网上找下关于图片预览的插件，有找到三个插件，具体的优劣势的看自己的使用吧，我目前只是在电脑查看效果，分别是viewerjs插件、基于photoswipe的vue-photo-preview插件以及vue-picture-preview插件 作者：北极星丶超帅的 链接：https://www.jianshu.com/p/e3350aa1b0d0 来源：简书 简书著作权归作者所有，任何形式的转载都请联系作者获得授权并注明出处。

当在页面显示的时候，万一图片被移动了位置或者丢失的话，将会在页面显示一个带X的图片，很是影响用户的体验。即使使用alt属性给出了”图片XX”的提示信息，也起不了多大作用。

初学vue的时候，不知道如何在方法中跳转界面并传参，百度过后，了解到两种方式，params 与 query。然后，错误就这么来了：

JavaScript递归方法 生成 json tree 树形结构数据

今天早上来到公司，没事看了一下别人的博客，然后试了一下，发现的确是可以的，在此记录一下，方便自己日后查阅。 首先新建一个文件夹：commonFunction ,然后在里面建立 一个文件common.js

突然发现在使用LayUI时，用到弹出层layer.prompt时，如果文本框输入值是空的话点击确定没有反应,不能向下执行。 但是我又需要在这种情况下去继续执行判断或逻辑时该怎么做？？

原型链上继承过来的属性无法通过hasOwnProperty检测到，返回false。 需注意的是，虽然in能检测到原型链的属性，但for in通常却不行。

视频播放的时候，有时候需要用户去设置浏览器的Flash插件此网站上始终允许，但大多用户不会设置，希望做个友好的提示给用户，让用户点击，然后就直接设置好并刷新页面，视频就能正常加载了

RegExp("12333", "g"); 第一个参数是想要替换的内容 第二个参数“g”是匹配全部的意思，也可以换成"t"，就是匹配第一个

canvas中鼠标点击绘制图片

下面用 pm2 来启动我们自己的服务程序 app.js, 然后告诉 pm2 开机后自动运行我 app.js 继续在管理员命令行下, cd 到 app.js 所在目录

隐写术是一门研究隐藏信息的科学艺术，通过隐写术，可以只让发送者和接收者知道隐藏的信息。 图像隐写术则是研究将数据隐藏在图像中，通过该技术可以防止无关用户发现这些隐藏的信息或数据。

应预先设置验证首选项。在打开 PDF 后显示包含签名的验证详细信息时，这有助于确保数字签名有效。有关详细信息，请参阅设置签名验证首选项。

在客户端开发的时候，有时需要把密钥保存在本地。这时就会遇到密钥安全性的问题。要保证密钥安全性，无非就是混淆、隐藏、白盒等手段。本文以隐藏在图片中来阐述密钥的安全保存。

印章是我国特有的历史文化产物，古代主要用作身份凭证和行驶职权的工具。它的起源是由于社会生活的实际需要。早在商周时代，印章就已经产生。如今的印章已成为一种独特的，融实用性和艺术性为一体的艺术瑰宝。传统的印章容易被坏人、小人私刻；从而新闻鲜有报道某某私刻公章，侵吞国家财产。随着计算机技术、加密技术及图像处理技术的发展，出现了电子签章。电子签章是电子签名的一种表现形式，利用图像处理技术、数字加密技术将电子签名操作转化为与纸质文件盖章操作相同的可视效果，同时利用电子签名技术保障电子信息的真实性和完整性以及签名人的不可否认性

WORD/EXCEL签章模块，该部分实现与WORD/EXCEL的无缝结合，并提供给用户简单直观的菜单和工具条来实现文档签章验证等各种操作，其中，KHSC-64智能密码钥匙是签章模块中用户证书和图章的载体

封装nodejs的基本功能，封装为一个类，实现的功能能够如下：

Node.js文件系统、路径的操作函数

　　HTTP协议规格说明定义ETag为“被请求变量的实体值” 。另一种说法是，ETag是一个可以与Web资源关联的记号（token）。典型的Web资源可以一个Web页，但也可能是JSON或XML文档。服务器单独负责判断记号是什么及其含义，并在HTTP响应头中将其传送到客户端。

JS让代码中间间隔一段时间后执行

window环境下，electron的console.log调试中文乱码的问题，如何解决

​一般我们的js文件都是试用utf8编码保存的，但是中文windows的命令行一般默认使用cp936编码（就是gbk），这样我们用js代码 console.log('中文');输出日志的时候，会发现输出的是乱码。 网上有提供一些解决方案，典型的就是用iconv或iconv-lite，把这些中文字符串先转成gbk再输出。 但是这个方案我试了多次，在win10的命令行下，utf8的字符串是成功转成了gbk字符串了（通过打印Buffer可以见到），但是输出还是乱码。

npm ERR! write after end

npm cache 提供了三个命令，分别是npm cache add, npm cache clean, npm cache verify

最近在做一个项目的过程中，得到一个远程二维码图片的url，需要扫码登录，每次都是在控制台发url打印出来，再复制粘贴到浏览器的地址栏中打开扫码，整个过程过于繁琐，于是想找一个模块，直接在node下，指定浏览器打开该图片。这样可以省不少事。

nodejs 终端打印进度条实例代码

七牛私有空间，防盗链

安装完ImageMagick之后，直接执行“magick convert f:\parseWord\tmp\testpdf.pdf f:\parseWord\tmp\testpdf.jpg”，会报错，这是因为没有安装ghostscript，

GraphicsMagick是一个短小精悍的的图片处理工具和库集合。对于Java开发者来说，常用的图片处理工具有3个，JDK自带的图片处理库，ImageMagick，GraphicsMagick。JDK自带的图片处理库，虽稳定简单，性能却比较差；ImageMagick是目前最流行的图片处理工具，它的功能非常丰富；GraphicsMagick的功能略逊于ImageMagick，但是它的效率更强悍，但大多数情况下，GM的功能已经足够使用了。

node党悲催的发现，图片处理工具只有一个gm可以选。gm无非是调用了GraphicsMagick/ImageMagick而已，性能不敢恭维。但是有很多后台生成图片的场景，没办法，只能硬着头皮上了。

node图片处理工具gm的使用：图片水印、图片验证码、图片裁剪示例

Js获取当前日期时间及其它操作

js数组的顺序排序、完全随机打乱排序 总结

使用JS编写一个方法 让数组中的元素每次刷新随机排列

Node.js 是跨平台的，也就是说它能运行在 Windows、OSX 和 Linux 平台上。很多 Node.js 开发者都是在 OSX 上做开发的，然后再将代码部署到 Linux 服务器上。由于 OSX 和 Linux 都是基于 Unix 的，因此两者共性很多。Windows 也是 Node.js 官方支持的平台，只要你通过正确的方式写代码，就能在各个平台上毫无压力的跑起来。

child_process是nw.exe的一个内置模块，通过它可以实现创建多线程，并可实现主线程和子线程之间的通信。child_process模块中主要使用有两个方法spawn和exec，这两个方法都可以用来创建子线程。除了spawn和exec外，child_process模块还有execFile,fork,spawnSync,execFileSync,execSync，它们都是基于spawn的不同封装。 --------------------- 作者：黄泽平 来源：CSDN 原文：https://blog.csdn.net/zeping891103/article/details/52230175 版权声明：本文为博主原创文章，转载请附上博文链接！

对于我们这些国内玩家而言，实现youtube视频爬虫和批量采集有先天性的遗憾。起初，公司需要一大批的youtube视频，时长3分钟左右，720p下载的话，每视频30-50M左右。公司雇了一大批人，采购科学上网神器手工下载 ，无奈，效率之低令人发指。所以老板要我做爬虫自动采集，需求每天下载2000+个视频，视频存储需要提高国内访问速度，方便合作方的程序抓取我们的内容。 --------------------- 作者：ucsheep 来源：CSDN 原文：https://blog.csdn.net/ucsheep/article/details/81380342 版权声明：本文为博主原创文章，转载请附上博文链接！

NodeJs上传文件至七牛

Fingerprintjs2是一款开源的设备指纹采集器。最初的fingerprintjs库创建于2012年，但是由于新版本的开发很难保持向后兼容，因此Fingerprintjs2项目中增加了很多的新内容。

几个月前，就有同事跟我反馈，说磨途歌的留言板有问题。当时看了一下，她用的是谷歌浏览器，确实打不出中文，才按下一个字母，英文字母就从输入法的输入框中直接跳出来了，更换火狐浏览器就没这个问题。很奇怪的是，在我电脑上的火狐浏览器跟谷歌浏览器都没有问题，一开始还以为是她电脑的问题，就没在意了。

用anyproxy抓取https接口

DNS Prefetch，即DNS预获取，是前端优化的一部分。一般来说，在前端优化中与 DNS 有关的有两点： 一个是减少DNS的请求次数，另一个就是进行DNS预获取 。

七牛js上传图片，小米手机，没有应用可执行操作

nodemailer发送邮件各个服务器接口

前段时间有个很普通的项目需要发邮件的功能，而且是刚开始学nodejs，所以只是搜索了下用什么好的库能实现，就找到了nodemailer了。这篇文章主要是记录一下使用的过程和经验。

在项目中使用矢量图至少可以缩小我们apk包的尺寸，而且可以在屏幕适配时提供很大的方便，因为矢量图是分辨率无关的。

提到网页加载速度优化，大家都会想到静态资源上CDN，CSS和JS文件合并，图片合并成雪碧图等常用手段；但是在某些特殊情况下这些常用方法也无法达到理想的效果。比如，在国际化场景下，很多国家还停留在2G网络阶段，无论如何优化，都无法避免过慢的网络请求。最近一直在做国际化(主要是印尼和泰国)背景下的webview性能优化，也算有一些经验。由于我们的产品是面向android用户的，而android手机对H5支持很好，因此我们主要是应用H5的新特性。

html 对 div 进行 拉伸 拖拽

js实现div上下左右拉伸

js拖拽是常见的网页效果，本文将从零开始实现一个简单的js插件。

记住一定要用$(function){}包裹，既再网页加载完以后。

仔细阅读文档，深度理解写文档作者的用意。

原来ajax可以设置超时时间，那么简单，ajax还有更多功能，虽然不怎么用它，有时候还挺好用。

axios 发 post 请求，后端接收不到参数的解决方案

​ ​由于富文本插入过来的图片过大，导致详情页里面的图片展示超过的我给的布局，尤其是在手机页面。这样就会很难看。 这个可以用

ueditor的附件功能自带上传pdf功能，html进行pdf展示。（再放开插入html元素 iframe标签的前提下）

如下文案，如何提取中间的文案呢 eq: 我们的%%aaa%%不一致,哈哈哈 提取后是aaa

图片轮播继承自slide插件，因此其DOM结构、事件均和slide插件相同； 在MUI框架中针对图片的轮播做了一个简单的封装。

1.for in 循环 并且使用hasOwnProperty 方法

由于 JavaScript 的限制，Vue 不能检测以下变动的数组

Nested Set Model 是一种实现有序树的高明的方法，它快速且不需要递归查询，例如不管树有多少层，你可以仅使用一条查询来获取某个节点下的所有的后代，缺点是它的插入、移动、删除需要执行复杂的sql语句，但是这些都在这个插件内处理了！

小程序文件结构很简单，一个主体app以及各个页面

今天安装gulp-sass的时候报错: checking for Python executable "python2" in the PATH， 尝试了很多方法，最后用cnpm来安装就安装成功了

去年夏天我开始学习信息安全与黑客技术。在过去的一年中，我通过参加各种战争游戏、夺旗以及渗透测试模拟，不断提高我的黑客技术，还学习了很多关于“如何让计算机偏离其预期行为”的新技术。

jquery中的live()方法在jquery1.9及以上的版本中已被废弃了，如果使用，会抛出TypeError: $(...).live is not a function错误。

nodejs模块 node-schedule使用,定时任务

这篇文章给大家总结下JS实现数组去重方法(六种方法)，面试中也经常会遇到这个问题。文中给大家引申的还有合并数组并去重的方法，感兴趣的朋友跟随脚本之家小编一起学习吧

这几天在做一个微博的接入，需要判断微博是否被关注，要检查微博标签的DIV是否有“已关注”的字符，但这个DIV的内容是微博JSSDK动态生成。$("#id").html()是获取不到我想要的内容。原因是当我们获取的时候内容还没有改变，所以获取不到，如果就想到监听这个DIV内容变化后，再来获取就个时候就能获取到了。于是产生新的问题，如何监听DIV的变化？

在做web开发时候很多时候都需要即时监听输入框值的变化，以便作出即时动作去引导浏览者增强网站的用户体验感。而采用onchange时间又往往是在输入框失去焦点（onblur）时候触发，有时候并不能满足条件。

canvas,ImageData,getImageData

ArrayBuffer对象、TypedArray对象、DataView对象是JavaScript操作二进制数据的一个接口。这些对象早就存在，属于独立的规格，ES6将它们纳入了ECMAScript规格，并且增加了新的方法。

一个document 的 Document.readyState 属性描述了文档的加载状态。

ES6为Array增加了fill()函数，使用制定的元素填充数组，其实就是用默认内容初始化数组。

Web Performance API允许网页访问某些函数来测量网页和Web应用程序的性能，包括 Navigation Timing API和高分辨率时间数据。

Web Performance API允许网页访问某些函数来测量网页和Web应用程序的性能，包括 Navigation Timing API和高分辨率时间数据。

使用html5 的video标签播放视频的时候，限制视频的尺寸，在android上是没有问题的，但是在ios上发现，视频没有开始播放的时候还是好的，但是一旦播放开是，就会全屏，非常奇怪。

我们平时使用HTTP协议无非就是GET、POST这些方法，但是HTTP的内容远不止那些。今天就来说说HTTP代理使用的CONNECT。这个不是在网页开发上用的，如果没兴趣就跳过吧。

npm install bcrypt,node-sass –save引起了让人很烦恼的错误，整个人心情都不好了。下边是个人的解决方法：

目标站点的编码是:GBK的，用NodeJS爬取的时候，出现乱码的情况？

进制转换，2进制，8进制，10进制，16进制之间的转换

javascript过滤掉<img></img>和<img />形式的字符串，java代码过滤字符串中类似于<img></img>和<img />形式的字符串

DOM是Web前端领域非常重要的组成部分，不仅在处理HTML元素时会用到DOM，图形编程也同样会用到。比如SVG绘图，各种图形都是以DOM节点的形式插入到页面中，这就意味着可以使用DOM方法对图形进行操作。比如有一个<path id=”p1″>元素，可以直接用jquery增加click事件$(‘#p1’).click(function(){…})”。然而这种DOM处理方法在HTML5的Canvas里不再适用，Canvas使用的是另外一套机制，无论在Canvas上绘制多少图形，Canvas都是一个整体，图形本身实际都是Canvas的一部分，不可单独获取，所以也就无法直接给某个图形增加JavaScript事件。

itellij,android Stuio 突然报这样的错误。下面是解决方案。

相信很多同学都知道“贝塞尔曲线”这个词，我们在很多地方都能经常看到。但是，可能并不是每位同学都清楚地知道，到底什么是“贝塞尔曲线”，又是什么特点让它有这么高的知名度。

因为觉得网络上的 idea 快捷键不够详尽，所以特别编写了此篇文章，方便大家使用 idea O(∩_∩)O~ 其中的英文说明来自于 idea 的官网资料，中文说明主要来自于自己的领会和理解，英文说明只是作为参考。重要的快捷键会附带图示，进行详细的说明。

用vue模仿原生，去监听hash变化来做些事情感觉不错，

怎么去除location，中的hash

上下居中，在html中没有简单的属性处理，这个不知道为啥，不过在最新的技术里面已经有了好的处理方方式。

已知圆心，半径，角度，求圆上的点坐标

限制文本框只能输入正数，小数

从开始接触js时，我们便知道js是单线程的。单线程，异步，同步，互调，阻塞等。在实际写js的时候，我们都会用到ajax,不管是原生的实现，还是借助jQuery等工具库实现，我们都知道，ajax可以实现局部刷新，并且在请求处理时，任然可以响应用户的操作，比如点击事件。不是说js是单线程吗?这些都是怎么实现的？ 在阅读《深入理解Bootrap的源码》一书，在分析轮播组件(carousel.js)的源码时，作者对一句代码操作的注释引起了我的兴趣。

用anyproxy然后得出的response，console出buffer怎么办？

Cross-platform image decoder(png/jpeg/gif) and encoder(png/jpeg) for Node.js Node.js轻量级跨平台图像编解码库

小程序刚开放公测，互联网圈内开始了各种解读和猜测。其中有观点认为小程序和HTML5有着紧密关联，甚至小程序就是基于HTML5开发。 经过仔细研究文档和代码开发，从视图层的角度来说，小程序与传统HTML5还是有明显的区别，主要区别在于：

通过设置延迟的方式解决平滑滚动

有个文章表里面有个type字段,他存储的是文章类型,有 1头条,2推荐,3热点,4图文 .....11,12,13等等 现在有篇文章他既是 头条,又是热点,还是图文,

本文主要介绍了js判断是否在iframe中及防止网页被别站用 iframe嵌套的方法。具有很好的参考价值，一起来看下吧

js获取上一页、当前页及域名url方法，JS反回上一页的方法

获得npm全局变量的方法，设置npm全局变量的方法。

vue过渡和animate.css结合使用

直接使用VirtualBox开启一个vm也会失败，基本上可以确定是VirtualBox版本的问题 有遇到过安装了VirtualBox-5.0.22-108108-Win.exe的版本在win7下用不了，卸载重装VirtualBox-4.3.12-93733-Win.exe之后可用。

Vagrant 是一款用来构建虚拟开发环境的工具，非常适合 php/python/ruby/java 这类语言开发 web 应用，“代码在我机子上运行没有问题”这种说辞将成为历史。

Vagrant 是一个可创建轻量级、高复用性和便于移植的开发环境的工具。 此文章是作者折腾vagrant的笔记， 希望大家看后，不再去网上搜罗资料， 能顺利搭建vagrant环境。vagrant更新较快， 还建议大家以官网为主。Vagrant官网

分享几款在线的api文档编辑协作软件

​cdn地址 http://www.bootcdn.cn/twbs-pagination/ 官网地址 可以在cdn地址上面查看到

git clone只能clone远程库的master分支，无法clone所有分支，解决办法如下：

js正则函数match、exec、test、search、replace、split使用介绍集合,学习正则表达式的朋友可以参考下。

XMLHttpRequest cannot load http://localhost/Foo.API/token. The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://localhost:5000' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

js中去除moji表情

这篇文章主要介绍了JavaScript正则表达式替换字符串中图片地址(img src)的方法,结合实例形式分析了JS正则替换的常用技巧与注意事项,需要的朋友可以参考下

Siege是一款开源的压力测试工具，设计用于评估WEB应用在压力下的承受能力。可以根据配置对一个WEB站点进行多用户的并发访问，记录每个用户所有请求过程的相应时间，并在一定数量的并发访问下重复进行。siege可以从您选择的预置列表中请求随机的URL。所以siege可用于仿真用户请求负载，而ab则不能。但不要使用siege来执行最高性能基准调校测试，这方面ab就准确很多

出现这种情况，一般是babel 没有设置好。 可以参考一下网址，设置babel

babel的使用，对于ES7async的支持

Simply put a semicolon (;) after console.log(…).

JavaScript 获取当前时间戳

这篇文章主要介绍了Nodejs中调用系统命令、Shell脚本和Python脚本的方法和实例,本文给出了利用子进程调用系统命令、执行系统命令、调用传参数的shell脚本、调用python脚本的例子,需要的朋友可以参考下

这种方式是把文件内容全部读入内存，然后再写入文件，对于小型的文本文件，这没有多大问题，比如grunt-file-copy就是这样实现的。但是对于体积较大的二进制文件，比如音频、视频文件，动辄几个GB大小，如果使用这种方法，很容易使内存“爆仓”。理想的方法应该是读一部分，写一部分，不管文件有多大，只要时间允许，总会处理完成，这里就需要用到流的概念。

glob 最早是出现在类Unix系统的命令行中, 是用来匹配文件路径的。比如，lib/**/*.js 匹配 lib 目录下所有的 js 文件。 除了在命令行中，我们在程序中也会有匹配文件路径的需求。于是，很多编程语言有了对 glob 的实现 ，如 Python 中的 glob 模块； php 中的 glob 方法。

官网是这么说的，翻译一下就是下一代JavaScript 语法的编译器。 作为前端开发，由于浏览器的版本和兼容性问题，很多JavaScript的新的方法都不能使用，等到可以大胆使用的时候，可能已经过去了好几年。Babel就因此而生，它可以让你放心使用大部分的JavaScript的新的标准的方法，然后编译成兼容绝大多数的主流浏览器的代码。

经常逛cnode社区，所以早已耳闻pm2，今天我们就研究一下它到底怎么部署项目。

其实 Node.js 对 ES6 的很多特性都已经开始支持了。 在 Node.js 使用的 JS 引擎 V8 里面将不同状态 ES6 特性分成了 3 个等级：

有时候需要用到，判断页面是向上还是向下滚动了，兼容比较低版本的浏览器如IE6、7等。

webstorm怎么配置css，js智能提示啊？

js变量前面的加号+

Delete是Javascript语言中使用频率较低的操作之一，但是有些时候，当我们需要做delete或者清空动作时，就需要delete操作。在这篇文章中，我们将深入探讨如何使用它，以及它是如何工作的。

去年6月份， ES2015正式发布（也就是ES6，ES6是它的乳名），其中Promise被列为正式规范。作为ES6中最重要的特性之一，我们有必要掌握并理解透彻。本文将由浅到深，讲解Promise的基本概念与使用方法。

但是emoji通过utf-8编码后，每个字符占4个字节，属于宽字符。而老版本的mysql只支持一个字符占3个字节，所以老版本的mysql是无法存储emoji的。新版本的mysql增加了字符集utf8mb4，可以支持单字符最多占4个字节。utf8mb4是utf8的超集，可以无需修改地支持原来的utf8字符 要让mysql存储emoji，需要满足2个条件：

nodejs 循环引用JSON序列化错误的解决办法：TypeError: Converting circular structure to JSON

nodejs 循环引用JSON序列化错误的解决办法：TypeError: Converting circular structure to JSON

本文主要阐述如何在 Express 中使用错误处理中间件（error-handling middleware）来高效处理异步错误。在 Github 上有对应 代码实例 可供参考。

对于同步执行的代码，以上的处理已经足够简单。然而，当异步程序在执行时抛出异常的情况，Express 就无能为力。原因在于当你的程序开始执行回调函数时，它原来的栈信息已经丢失。

如果你没有修改过MySQL的配置，缺省情况下，wait_timeout的初始值是28800。

在你不没有数据库操作的情况下，8小时后服务会挂点，因为你的数据库设置了超时时间。

最近在做一个个人项目，数据库尝试使用了mongodb、sqlite和mysql。分享一下关于mysql的连接池用法。项目部署于appfog，项目中我使用连接池链接数据库，本地测试一切正常。上线以后，经过几次请求两个数据接口总是报503。一直不明就里，今天经过一番排查终于顺利解决了。

原因在于node连接上mysql后如果因网络原因丢失连接或者用户手工关闭连接后，原有的连接挂掉，需要重新连接；如下代码，每次访问结束都关闭，每次开始访问前重连接下，代码中没有监听连接的fatal错误，copy需谨慎

我们只需在实例化SessionStore的时候，配置useConnectionPooling: true。比如：

在connection的参数那里加一个 dateStrings: true , 就可以了吧，我是datetime类型的，测试了可以

加上这两个meta放在head里，可以让微信，qq，uc浏览器使用全屏模式，全屏模式里，浏览器是不会上下左右滑动出现背景的。​

去年6月份， ES2015正式发布（也就是ES6，ES6是它的乳名），其中Promise被列为正式规范。作为ES6中最重要的特性之一，我们有必要掌握并理解透彻。本文将由浅到深，讲解Promise的基本概念与使用方法。

利用CSS进行元素的水平居中，比较简单，行级元素设置其父元素的text-align center，块级元素设置其本身的left 和 right margins为auto即可。本文收集了六种利用css进行元素的垂直居中的方法，每一种适用于不同的情况，在实际的使用过程中选择某一种方法即可。

本篇文章主要介绍了详解vue.js2.0父组件点击触发子组件方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下

async/await使用同步的方式来书写异步代码，将异步调用的难度降低到接近于0，未来必将大放异彩。然而在当下，由于标准化的缓存步伐，async/await尚在ES7的草案中。为了尝先，特试用了下面两种方式：

JS中给正则表达式加变量

刚开始用webpack的同学很容易掉进图片打包这个坑里，比如打包出来的图片地址不对或者有的图片并不能打包进我们的目标文件夹里(bundle)。下面我们就来分析下在webpack项目中图片的应用场景。

　　JSON(JavaScript Object Notation)和JSONP(JSON with Padding)虽然只有一个字母的差别，但其实他们根本不是一回事儿：JSON是一种数据交换格式，而JSONP是一种依靠开发人员的聪明才智创造出的一种非官方跨域数据交互协议。我们拿最近比较火的谍战片来打个比方，JSON是地下党们用来书写和交换情报的“暗号”，而JSONP则是把用暗号书写的情报传递给自己同志时使用的接头方式。看到没？一个是描述信息的格式，一个是信息传递双方约定的方法。

用nodejs把xls转为json

黑白名单配置。UEditor针对进入编辑器的富文本内容提供了节点级别的过滤，可以通过该配置的修改来达到控制富文本内容的目的

　　http://intellij.mandroid.cn/ 　　http://idea.imsxm.com/ 　　http://idea.iteblog.com/key.php

You need to configure the inspections in Settings/Editor/Inspections, then in the list on the right, find JavaScript/JavaScript validity issues. That worked for me to remove the Chai warnings. (I am using the WebStorm 11 EAP at the moment.)

本篇主要说一下Chrome RemoteDebugging 的方法，之前也遇到一些坑，自己总结了一些经验，分享如下。

本篇主要说一下Chrome RemoteDebugging 的方法，之前也遇到一些坑，自己总结了一些经验，分享如下。

NGINX + PHP-FPM 报 502 错误，我想大部分 SA 都遇到过吧。 根据报错的频率，可以分为两种情况，间歇性的502和连续性的502。 这里只讨论第一种情况——间歇性的502。

pm是来控制php-fpm的工作进程数到底是一次性产生固定不变（static）还是在运行过程中随着需要动态变化（dynamic）。众所周知，工作进程数与服务器性能息息相关，太少则不能及时处理请求，太多则会占用内存过大而拖慢系统。

vue的style绑定background-image

Browsersync能让浏览器实时、快速响应您的文件更改（html、js、css、sass、less等）并自动刷新页面。更重要的是 Browsersync可以同时在PC、平板、手机等设备下进项调试。您可以想象一下：“假设您的桌子上有pc、ipad、iphone、android等设备，同时打开了您需要调试的页面，当您使用browsersync后，您的任何一次代码保存，以上的设备都会同时显示您的改动”。无论您是前端还是后端工程师，使用它将提高您30%的工作效率。

本例中加载的js库是 jQuery 放在本地的原因是: 1.js库本身挺大，浪费流量 2.js库可能常年不更新

离线存储,本地缓存,manifest

这样可以正常启动应用，但是如果断开客户端连接，应用也就随之停止了。也就是说这样的启动方式没有给应用一个守护线程。

127.0.0.1:3000/index，这种情况下，我们为了得到index，我们可以通过使用req.params得到，通过这种方法我们就可以很好的处理Node中的路由处理问题，同时利用这点可以非常方便的实现MVC模

把一个日期字符串如“2007-2-28 10：18：30”转换为Date对象：

js,正则表达式,验证数字

用深度watch

这时我们便需要引入相应的webpack loader来帮助我们解析这段代码。 一般来说需要引入css-loader和style-loader，其中css-loader用于解析，而style-loader则将解析后的样式嵌入js代码。

如果你有 PHP 开发经验，会习惯在修改 PHP 脚本后直接刷新浏览器以观察结果，而你在开发 Node.js 实现的 HTTP 应用时会发现，无论你修改了代码的哪一部份，都必须终止Node.js 再重新运行才会奏效。这是因为 Node.js 只有在第一次引用到某部份时才会去解析脚本文件，以后都会直接访问内存，避免重复载入，而 PHP 则总是重新读取并解析脚本(如果没有专门的优化配置)。

饿了么团队开源一个基于vue 组件库

JavaScript没有类的概念，但几乎所有的东西又是基于对象的，同时也能实现继承，这就是js跟其他OOP语言最大的不同之处，这也是js最难理解的一块。下面我来说说我个人的理解。

postMessage()方法允许来自不同源的脚本采用异步方式进行有限的通信，可以实现跨文本档、多窗口、跨域消息传递。

is_int — 检测变量是否是整数

scroll,高性能,页面渲染

git,权限修改,冲突,忽略

开发过程中经常需要动态加载js和css，今天特意总结了一下常用的方法。

当用户点击iOS的Safari浏览器中的链接或JavaScript的可点击的元素时，覆盖显示的高亮颜色。 该属性可以只设置透明度。

当用户点击iOS的Safari浏览器中的链接或JavaScript的可点击的元素时，覆盖显示的高亮颜色。 该属性可以只设置透明度。

首先可以vue的事件与html中的事件是一致的。

其实这个标题略微有点标题党：iOS 中，除了少数服务（如播放音乐），大部分 App 在用户按了 Home 键之后，过不了多久就会被完全冻结，这对 Safari 同样适用。本文不考虑这样情况，只考虑 Safari 运行时，怎样让定时器持续工作。

jQuery中如何判断当前点击的是第几个li，使用$(this).index()取得li的下标，下面的示例，大家可以看看

jquery控制input只能输入数字和两位小数

开发过程中经常需要动态加载js和css，今天特意总结了一下常用的方法。

pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。 <pre> 标签的一个常见应用就是用来表示计算机的源代码。

删除数组指定的某个元素

​Javascript使用正则表达式检测用户输入的URL地址是否有效：

js数组转成对象

javascript时间戳和日期字符串相互转换

Drupal 8 version uses Guzzle Http Client internally, but under the hood it may use cURL or PHP internals. If you installed PHP cURL on your PHP server it typically uses cURL and you may see an exception with error Peer certificate cannot be authenticated with known CA certificates or error code CURLE_SSL_CACERT (60).

如果系统中有一些配置文件在服务器上做了配置修改,然后后续开发又新添加一些配置项的时候, 在发布这个配置文件的时候,会发生代码冲突:

js 判断字符串是否包含某字符串,String对象中查找子字符,indexOf

onhashchange监听url,hash变化

　关于左侧宽度固定，右侧宽度自适应两列布局的一种很常用的方法我相信大家都知道。就是利用左侧元素浮动，或者绝对定位的方式使其脱离常规文档流，让两个块级元素能够在同一行显示。然后右侧元素 margin-left 的值等于左侧元素宽度，这时右侧元素将紧挨着左侧元素

使用IntelliJ IDEA 14和Maven创建java web项目

通过nginx运行php服务返回phpinfo()信息。

安装nginx

安装mysql

安装php7.0

安装remi Yum源

2016年的顶尖优秀开发工具

　SpinKit 是一套网页动画效果，包含8种基于 CSS3 实现的很炫的加载动画。借助 CSS3 Animation 的强大功能来创建平滑，易于定制的动画。SpinKit 的目标不是提供一个每个浏览器都兼容的解决方案，而是给现代浏览器提供更优的技术实现方案和更佳的使用体验。（为保证最佳的效果，请在 Chrome、Firefox 和 Safari 等现代浏览器中浏览）

webstorm的保存，会在临时文件夹中创建一个文件用来保存（好像没有出发实际文件的变更），所以我们要在setting中勾掉这个设置，如下图

在很久之前就想通过工具来规范自己的代码风格，减少程序出错的概率，如果看过我的 一个前端程序猿的Sublime Text3的自我修养 ，这篇博客的朋友，肯定知道在当时我使用 SublimeLinter-jshint 插件来规范风格，但是实际上一直懒癌发作也没去看它的文档，使用着它默认的规则。不过现在是时候切换到 ESLint 了！

src目录下的资源只能import或require。 想静态引入的话，建立一个与src同级的目录例如static，然后把静态资源放入该文件夹下，html的引入路径如下：./static/...

和后端联调时总是会面对恼人的跨域问题，最近基于Vue开发项目时也遇到了这个问题，两边各自想了一堆办法，查了一堆资料，加了一堆参数，最后还得我把自己的localhost映射成上线时将要使用的域名。

这里做的是对webpack整个配置文件的分析。

webpack-dev-server是一个小型的node.js Express服务器,它使用webpack-dev-middleware中间件来为通过webpack打包生成的资源文件提供Web服务。它还有一个通过Socket.IO连接着webpack-dev-server服务器的小型运行时程序。

process对象是Node的一个全局对象，提供当前Node进程的信息。它可以在脚本的任意位置使用，不必通过require命令加载。该对象部署了EventEmitter接口。

虽然node对操作系统做了很多抽象的工作，但是你还是可以直接和他交互，比如和系统中已经存在的进程进行交互，创建工作子进程。node是一个用于事件循环的线程，但是你可以在这个事件循环之外创建其他的进程（线程）参与工作。

vue-cli 是一个官方发布 vue.js 项目脚手架，本篇使用 vue-cli 可以快速创建 vue 项目。

vue-cli 是一个官方发布 vue.js 项目脚手架，本篇使用 vue-cli 可以快速创建 vue 项目。

vue-cli 是一个官方发布 vue.js 项目脚手架，本篇使用 vue-cli 可以快速创建 vue 项目。

当我们真正开发一个应用的时候，我们不可避免的会用到一大堆的工具，模块化、预处理器、热模块加载、代码校验和测试。这些工具对于一个需要长期维护的大型应用是必须的，但是项目初始化将会是让人痛苦的事情。这就是为什么我们做了 vue-cli 。

$(window).height 本应是可见窗口的大小，$(document).height()是文档的高度。

CommonJS模块规范。 根据这个规范，每个文件就是一个模块，有自己的作用域。在一个文件里面定义的变量、函数、类，都是私有的，对其他文件不可见。

如今最常用的JavaScript库之一是RequireJS。最近我参与的每个项目，都用到了RequireJS，或者是我向它们推荐了增加RequireJS。在这篇文章中，我将描述RequireJS是什么，以及它的一些基础场景。

AMD是"Asynchronous Module Definition"的缩写，意思就是"异步模块定义"。它采用异步方式加载模块，模块的加载不影响它后面语句的运行。所有依赖这个模块的语句，都定义在一个回调函数中，等到加载完成之后，这个回调函数才会运行。

随着网站逐渐变成"互联网应用程序"，嵌入网页的Javascript代码越来越庞大，越来越复杂。网页越来越像桌面程序，需要一个团队分工协作、进度管理、单元测试等等......开发者不得不使用软件工程的方法，管理网页的业务逻辑。

nth-child是css中比较强大的一个选择器，我们能利用他的一些特性做出很多东西，更多他的用途还待于我们去开发。