1.npm install -vconsole --save-dev 2.npm install -vconsele-webpack-plugin --save-dev 3.webpack.base.conf.js 'use strict' const path = require('path') const utils = require('./utils') const config = require('../config') const webpack = require('webpac

vConsole github地址vConsole 是腾讯开源的项目,这就简单的介绍一下使用 使用npm引入vconsole.min.js下载 vConsole 的最新版本.(不要直接下载 dev 分支下的 dist/vconsole.min.js) 或者使用 npm 安装: npm install vconsole引入 dist/vconsole.min.js 到项目中: <script src="path/to/vconsole.min.js"></script&

通过Link标签在网页头部引用Google Web Font: 1 <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Noto+Sans+SC:100,300,400,500,700,900"> 字体:Noto Sans SC 大小:100, 300, 400, 500, 700, 900 在需要使用思源黑体的地方设置CSS样式: font-family: "

最近项目需要我做些前端的事,这让我这个半吊子前端很是痛苦.项目中需要一个编辑器,之前找了个ueditor,插件比较多,需要改源码等等不说,最后弄好了,发现需要flash插件.没办法,只有推到重来,在网上寻找对比后,最后决定使用用wangEditor,首先它简单,轻量,基本能满足我的需求,不好的地方就是网上的demo不是很多,不是大公司的开源产品,不知道能不能坚持更新下去,不过ueditor都不更新了,也没必要强求. 首先贴上官方地址:https://www.kancloud.cn/wangfup

我们在开发手机版网页的时候,常常会出现下面的情景: (1) 开发时,在自己电脑上运行得好好的,在手机上打开就挂了,但是手机上又看不到error log: (2) 上线后,某用户表示页面失灵,但我们自己又重现不出来,看不到用户侧的出错信息. 如果说(1)还可以通过电脑连接手机以查看log来解决,那(2)在没有完善的前端上报体系时就非常被动了. 作为开发者,我们的诉求很简单:有没有快捷的方法在手机前端页面看到log日志? 答案是肯定的. vConsole:一个轻量.可拓展.针对手机网页的前端开发者调

今天,无意间从别人那里得知一个很好的js插件--vconsole.min.js,可以实现在移动端打印输出内容以及查看网络请求.下面记录使用方式. 1.下载vconsole.min.js插件 以下复制了插件vconsole.min.js的内容 /*! * vconsole v2.5.1 (https://github.com/WechatFE/vConsole) * Copyright 2016, WechatFE Team * MIT license */ !function(e,t){"obj

移动端调试神器vconsole,手机端网页的调试工具Eruda 移动端中使用 vConsole调试 移动端调试工具vconsole安装Git地址:https://github.com/WechatFE/vConsolevConsole是一款由微信公众平台前端团队打造的前端调试面板,专治手机端看log难题.目前vConsole自带有2个面板,默认为“日志”面板,负责展示log. 项目开发时经常需要debug调试,但在移动端debug则会阻断代码运行,并且很难判断出错在哪里,这里我们需要借助第三方插

在真实手机上运行H5页面时,无法看到控制台.为了能在真实手机上使用控制台,可以加入如下代码实现控制台: //引入vconsole var isTestEnvironment =true if(isTestEnvironment){     var script,     scripts = document.getElementsByTagName(]     function load(url) {         script = document.createElement('script

在上一篇<基于HT for Web矢量实现2D叶轮旋转>中讲述了叶轮旋转在2D上的应用,今天我们就来讲讲叶轮旋转在3D上的应用. 在3D拓扑上可以创建各种各样的图元,在HT for Web系统中提供了一些常规的3D模型,但是对于那些比较复杂的模型,比如汽车.人物等模型就无能为力了,那再项目中需要用到这样的模型该肿么办呢?这时候就需要借助专业的3ds Max工具来建模了,然后通过3ds Max工具将模型导出成obj文件,然后再项目中引用导出的obj文件,这样就能成功的使用上复杂的图元了. 在&l

随着时代的变迁与技术的不断的更新,在当今这个时代,Web中的图标(Icons)不再仅仅是局限于<img>.除了<img>直接调用Icons文件之外,还有Sprites(俗称雪碧图).Icon Font(字体图标).SVG Icon等等.今天我们就来一起探讨一下这些方法在Web中实现Icon的利弊. 思考变革 设计师不管分辨率(Resolution independent)和设备平台,其追求像素完美(Pixel Perfection).体验一致性:而前端工程师们更为关心的是页面的可访

一般调试手机端页面时,基本是在PC端使用手机模式进行断点或console调试.或查看有用的控制台信息的,但依旧有部分功能无法在PC端调试,经常需要使用alert进行断点,然后在手机端看效果,但是这样并不好. 所以如果说有一种插件,可以在手机端查看控制台相关日志,那可比alert强多了. 最近找到了一款,还挺好用的. 插件名:vconsole 比如我们要调试一个移动端页面 我们在页面中注入一段代码:引入vconsole,并创建一个控制台对象. <!--//www.wuhairui.cn/build

最近在改一个移动端项目,在手机上调试贼头疼,什么日志都看不到,分析不了bug问题. 然后我同事给我介绍了一个移动端的调试神器 -- vconsole 有了这个神器,领导再也不用担心我的工作啦!!! 0.0 怎么使用VConsole呢? 超简单的,只需要2步 第一步: 在页面引入vconsole的cdn: https://cdn.bootcss.com/vConsole/3.3.0/vconsole.min.js 或者是下载下来 还可以安装依赖 npm install  vconsole,请根据自

最近发现了一个鹅厂的仓库,实现起来比我这个方便[捂脸].https://github.com/AlloyTeam/AlloyLever 一.vue-cli脚手架中搭建的项目引入vConsole调试 1.首先npm安装,大家都懂的. npm install vconsole 2.在合适的地方新建一个文件vconsole.js,内容如下: import Vconsole from 'vconsole' let vConsole = new Vconsole() export default vCon

一 安卓 一 chrome 1.安卓手机安装chrome浏览器,手机打开开发者模式,用usb线链接电脑,并且允许调试. 2.电脑chrome地址栏输入 chrome://inspect 进入后点击 inspect 即进入调试模式(注意:第一次调试必须FQ). 3.调试和电脑端基本没有差异.电脑端修改样式等,手机立马变化. 二 webview 1.手机必须安卓4.4+ 2.安卓端必须打开允许调试的权限 if (Build.VERSION.SDK_INT >= Build.VERSION_CODES

一个针对手机网页的前端 console 调试面板. 简介 vConsole 是一个网页前端调试面板,专为手机 web 页面量身设计,帮助开发者更为便捷地进行开发调试工作. 手机预览 http://wechatfe.github.io/vconsole/demo.html 使用方法 1.下载模块 checkout 文件 dist/vconsole.min.js 到本地. 2.引入模块 (1) 如果未使用 AMD/CMD 规范,可直接在 HTML 中引入 vConsole 模块.为了便于后续扩展,建

当我们在浏览器开发vue页面时,由于浏览器对于调试有天然的支持,我们开发起来很方便.但是现在已经进入了移动端时代,移动端页面的需求越来越大. 在开发移动端页面的时候我们通常是在浏览器完成开发完成,之后才在手机端测试,如果测试出现问题还得重新回到浏览器上寻找错误.甚至还有嵌入在APP的页面,经过调试之后还要重新发包.当然还有更加奇怪的现象,由于手机浏览器和Web浏览器的差异,经常会发现在Web浏览器上好好的,一到手机上就不行的情况. 因此首先我们需要一个能在手机端调试的插件.如果你还在使用aler

前言 whistle是基于Node实现的跨平台抓包调试代理工具,有以下基本功能: 查看HTTP.HTTPS请求响应内容 查看WebSocket.Socket收发的帧数据 设置请求hosts.上游http/socks代理 修改请求url.方法.头部.内容 修改响应状态码.头部.内容,并支持本地替换 修改WebSocket或Socket收发的帧数据 内置调试移动端页面的weinre和log 作为HTTP代理或反向代理 支持用Node编写插件扩展功能 具体功能如下: 一.安装启动 1.whistle安

H5 移动调试全攻略 随着移动设备的高速发展,H5 开发也成为了 F2E 不可或缺的能力.而移动开发的重中之重就是掌握调试技巧,定 Bug于无形. 一.概要 因为移动端操作系统分为 iOS 和 Android 两派,所以本文的调试技巧也会按照不同的系统来区分.寻找最合适高效的方式,才能让你事半功倍. 文章会列举目前适合移动端调试的多种方案,快来选择你的最佳实践吧! 二.iOS 设备 Safari:iphone 调试利器,查错改样式首选,需要我们做如下设置: 浏览器设置:Safari – 偏好设置

前言 原来一直使用他人的开源项目框架,异常的定位会很麻烦,甚至不知道这个异常来自我的代码还是这个框架本身.他人的框架有一定的制约性,也有可能是我对那些框架并没深入了解,因为这些开源框架在网上也很难找到高效并且规范的文档.比如别人的框架可能调用了Enterprise Library来实现权限的验证,但在我的项目中,权限验证有可以复用的模块,所以在整合时会非常不灵活.... 参考了很多网上的优秀框架,看了几本书后,突然意识到易用才是开发和使用框架的出发点与立足点,框架并不是越复杂越好,评价一个框架的

主要分析点: 一.Spring开源框架的简介  二.Spring下IOC容器和DI(依赖注入Dependency injection) 三.Spring下面向切面编程(AOP)和事务管理配置  一.Spring开源框架的简介  Spring是一个开源框架,Spring是于2003 年兴起的一个轻量级的Java 开发框架,由Rod Johnson 在其著作Expert One-On-One J2EE Development and Design中阐述的部分理念和原型衍生而来.它是为了解决企业应用开

在上一篇<基于HT for Web矢量实现2D叶轮旋转>中讲述了叶轮旋转在2D拓扑上的应用,今天我们就来讲讲叶轮旋转在3D上的应用. 在3D拓扑上可以创建各种各样的图元,在HT for Web系统中提供了一些常规的3D模型,但是对于那些比较复杂的模型,比如汽车.人物等模型就无能为力了,那再项目中需要用到这样的模型该肿么办呢?这时候就需要借助专业的3ds Max工具来建模了,然后通过3ds Max工具将模型导出成obj文件,然后再项目中引用导出的obj文件,这样就能成功的使用上复杂的图元了. 在