使用模拟器调试手机浏览器
在 iOS 中调试 Safari 浏览器
打开模拟器, 在模拟器的 safari 中属于一个地址
打开 safari, 启动开发者模式 > 勾选在菜单栏中显示 “开发” 菜单
在开发中选择
这样既可测试不同系统下的 safari 显示
打开模拟器, 在模拟器的 safari 中属于一个地址
打开 safari, 启动开发者模式 > 勾选在菜单栏中显示 “开发” 菜单
在开发中选择
这样既可测试不同系统下的 safari 显示
官方链接 : 错误处理
这里主要使用前端来生成 pdf, 但是由于浏览器安全性的问题会导致浏览器不允许读取图片, 以下这几个步骤则可以生成 pdf
JSDOC 是一个 API 文档生成器,你只需要在代码中添加特定格式的注释,它就可以从注释中为你生成 HTML 文档。
[ps]这个工具支持不同的开发环境, 支持不同的开发语种, 不限于前端, 也不限于后端, 实现原理是监听内容文件夹, 实现改动, 自动刷新, 例如 php, html, css 等等..
Browsersync 能让浏览器实时、快速响应您的文件更改(html、js、css、sass、less等)并自动刷新页面。更重要的是Browsersync可以同时在PC、平板、手机等设备下进项调试。您可以想象一下:“假设您的桌子上有pc、ipad、iphone、android等设备,同时打开了您需要调试的页面,当您使用browsersync后,您的任何一次代码保存,以上的设备都会同时显示您的改动”。无论您是前端还是后端工程师,使用它将提高您30%的工作效率。
原文地址: Watch for Changes
这是 Introduction to Gulp.js 的第八部分. 今天我会使用 Gulp.js 为很多文件设置监听任务.
你还记得开始时候设置的监听任务么? 我们仅仅使用了 BrowserSync 和开发服务器, 但是没有监听任何东西, 这个任务将会监听这些.Watch
是 gulp api 的一部分. 他会监听文件的变化(增加/删除/修改), 这样会触发这个任务
gulp/config.js
原文地址: Images and Vector Fonts
这是 Introduction to Gulp.js 系列的第七章, 今天我会使用Gulp.js 用 Base64编码的url, 替换掉我的小图片.
原文链接: Introduction to Gulp.js 9: Checking the Syntax of SCSS and JavaScript
这是 Introduction to Gulp.js 的第九章. 今天我使用 Gulp.js 来自动的检查我的 Scss 和 JavaScript 文件中的语法错误和警告错误.
我打算给我的Scss 文件提示, 不是 css 文件. 因为给生成的 css 文件进行语法纠错一点意义都没有, 生活就是要做有意义的事. 但是可以 使用 gulp-csslint 来搞这个
原文: Introduction to Gulp.js 3: Build, Clean and Jekyll
这是 Introduction to Gulp.js 系列的第三部分. 今天我会写如何构建任务, 这是如何执行所有的构建下的子任务. 对于如何重建资源和如何建立我的 Jekyll 站.
原文地址: Introduction to Gulp.js 4: Creating CSS with Sass (and Compass)
这是 Introduction to Gulp.js 的第四部分. 今天我会告诉你怎样使用 Sass ( or Compass) 来建立 css 文件. 更深一层, 我会添加容器前缀并且建立对于 Sass 文件纠错用的源码映射.
原文地址: Introduction to Gulp.js 6: Images and Vector Fonts
这是 Introduction to Gulp.js 的第六部分, 这系列文章很长很复杂, 这次稍微简单点, 告诉你怎样移动我的图片和生成向量字体.
原文地址: Introduction to Gulp.js 5: Bundling JavaScript with Browserify
这是 Introduction to Gulp.js 的第五章. 今天我会告诉你怎么使用Browserify 来打包Javascript 和 使用 CommonJS 模块在浏览器中运行 node 模块.
原文地址 : Introduction to Gulp.js 2: Server with BrowserSync and Configuration
这是我的 Introduction to Gulp.js 系列的第二部分. 今天我会写一个 Gulp.js 任务并且配置一个 BrowserSync 服务, 同时我会写一个相关的配置文件.
Jordan Dawe
原文地址: Introduction to Gulp.js 1: Intro and Setup
我的网站自2014年一直运行在 Jekyll . 但是我一直不满意我的开发和构建过程, 我开始使用 Rake 任务和 Grunt.js 作为我的构建系统, 但是一部分的开发过程依然使用 Ruby, 我很大一部分使用 Compass 和 Jekyll Assets 来管理我的版本控制, 但是 Grunt.js
和Jekyll Asset Pipeline
一直不能很好地配合, 然后有了一个新的解决方案 Gulp.js.
原文链接: Introduction to Gulp.js 10: Generating CSS Image Sprites
这是 Introduction to Gulp.js 的第十章, 今天我会使用 Gulp.js 来创建 css 图片精灵.
仅仅是为了确定大家都知道我在说什么: 一个 CSS 图片精灵是把一组单个图片文件放入到一个大文件中. 这种方式减少了对服务器的请求次数, 从而让服务器访问更快些. css 文件将为每一个图片定位一个正确的位置.
因为 SVG 和矢量字体的应用, CSS 图片精灵并不是使用的很频繁. 但是我仍然使用它们作为不兼容向量字体浏览器的一个折衷方案.
我需要使用 Gulp.js 的 Spritesmith 插件:
原文地址:ESLint 使用入门
ESLint 是一个开源的JavaScript验证工具,相比JSLint,ESLint具有可配置性。其他跟JSLint 的不同之处:
在团队协作中,为避免低级 Bug、产出风格统一的代码,会预先制定编码规范。使用 Lint 工具和代码风格检测工具,则可以辅助编码规范执行,有效控制代码质量。
在以前的项目中,我们选择 JSHint 和 JSCS 结合使用,WebStorm 等开发环境已经支持这些工具,使用起来很顺手。然而,最近使用 React JSX 语法时,却遇到了问题:JSHint 不支持 JSX 语法。虽然有 JSXHint 这样的 JSHint 衍生工具,但个人并不喜欢这样的实现方式:不是以插件的形式实现,而是重新重新包装了一个工具。Nicholas C. Zakas 也不喜欢,所以有了 ESLint。
原来选择 JSHint 的时候,也对比过 ESLint,基于 ESLint 在速度上比 JSHint 要慢一些,最终使用了 JSHint。现在需要 JSX 支持了,才发现 ESLint 的设计理念更符合实际需求。
原文地址: axios全攻略
axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端
原文链接: Introduction to Gulp.js 11: Production Build, Server and Jekyll
This is the 11th part of my series Introduction to Gulp.js. Today I will start writing the production build task, set up a server to view the production code and build the production site with Jekyll.
In development I used the default
Gulp.js tasks to run the development server, building the assets and watching for changes. For production I will need another entry point.
I decided to name my task publish
. Later I am able to get a production build with the command gulp publish
.
gulp/tasks/publish.js
nvm 是 Node.js 的版本管理器 (version manager),可在同一台主機上安裝多個版本的 Node.js 環境,因為不同專案可能會使用不同的 Node.js 版本,那就需要透過一個版本管理器來切換不同的 Node.js 版本。
其实现在有更好的方案 : Laravel Mix, 如果需要学习可以参考此文档
github 地址: https://github.com/imvkmark/fe-refresh-demo
在开发过程中, 现在遇到了写一些 html 的例子来测试代码, 但是在做的过程中, 使用在线的 jsbin 等工具总不如本地的代码测试跟踪起来便利, 所以就想本地搭建一个服务器可以监听本地的文件并能够实时显示在浏览器中进行测试, 主要完成 html/css 的预览以及测试
我这里选用的技术栈是