• 实现传统模板渲染页面的静态资源版本自动管理
    浏览器在加载网站静态资源是有缓存策略的,当我们修改样式或脚本后,引用的资源地址没有发生改变,那么浏览器使用的资源都是以前的缓存。 我在自己的博客系统上加上了一个生成模板主题目录的MD5文件,使用静态资源的时候加上这个MD5,当主题目录任意一个文件被修改、新增、或删减都会生成一个新的MD5,通知浏览器该使用新的文件了。 ……
  • 传统模版页面中使用less的缓存问题
    在前后端分离的开发模式中less是将样式编译成css随项目一起打包的,而传统模板页面引用的less是将样式编译后动态插入到head标签中,同时保存在localStorage中,如果引用的less是加上版本号的,比如这样: <link rel="stylesheet/less" type="text/css" hr……
  • 纯CSS实现“开花”效果的加载(loading)动画
    .parent{ margin:0 auto; position:relative; width:100px; height:100px; left:0; animation:parent 1s linear 0s infinite alternate; } .child{ position: abso……
  • 一个纯CSS加载动画
    @keyframes wiggle{0%{transform:rotate(0) scale(1)}50%{transform:rotate(180deg) scale(.5)}100%{transform:rotate(360deg) scale(1)}}.loader{margin: 0 auto;display:……
  • 视频(mp4)在谷歌浏览器中自动播放属性无效的问题
    如下视频,在谷歌浏览器(chrome)中给video标签加上了autoplay属性,但是无法生效。 原因是谷歌浏览器在高版本中对于自动播放的视频有一个新的政策,默认不允许自动播放视频,哪怕是在Javascript中使用文档加载后播放也不行(window.onload = function(){ document.que……
  • vue插件开发和组件的区别
    vue插件和组件的区别 使用插件的方式包装组件和直接注册全局组件其实是一样的,都是注册组件。不同的是,一般组件我们是作为页面的某一块结构,按需引用,但是有些应用场景你可能会用到也可能用不到,总之就是你不知道什么时候会用到,总不能在每个页面都引用吧。再一个,控制组件需要传递props,也就是说每次引用都需要写方法才能达到……
  • VScode自动上传项目到FTP服务器
    一、下载VScode插件:SFTP 二、配置插件 在VScode中ctrl+shift+p,输入SFTP:config,选中并回车,再选择一个项目回车。系统会自动在项目根目录创建.vscode/sftp.json默认的配置文件,修改为需要的配置即可: { "name": "My Server",//服务器名称,……
  • npm - 工具包管理器
    使用cnpm并代替npm npm install -g cnpm --registry=https://registry.npm.taobao.org 或指定npm包的下载地址来源为淘宝镜像: npm config set registry https://registry.npm.taobao.org 发布npm包 ……
  • nvm - node.js版本管理工具(windows平台)
    官方网站:https://github.com/coreybutler/nvm-windows/releases 推荐使用免安装的版本,解压到某个磁盘。(这里以F盘为例) 设置用户环境变量 添加nvm路径变量: NVM_HOME -> f:\nvm 添加node快捷方式路径变量(nvm是通过设置该快捷方式路径来决……
  • 实现外网(互联网)访问内网(局域网)开发环境
    需要node.js,官方网站:https://nodejs.org 使用到的npm包:http-server、ngrok 一、安装http-server并启动服务器 1、全局安装:cnpm install http-server -g 2、启动服务器:http-server 默认端口为8080。 二、安装ngrok、启……