小知识点集汇四

chrome console 加载 jquery lodash 等

// chrome console 加载 jquery lodash 等
var a = await  fetch('//unpkg.com/jquery')
var b = await a.text()
eval(b)
console.log($===jQuery)
// 利用 jquery加载 lodash
$.getScript('//unpkg.com/lodash')
// 加载 lodash
var a = await  fetch('//unpkg.com/lodash')
var b = await a.text()
eval(b)
console.log(_.VERSION)

// 统计代码行数

find . -name '*.vue' |xargs wc -l
find . -name '*.js' |xargs wc -l
find . -name '*' |xargs wc -l

cloc推荐 使用如下 统计代码行数

// 前端异常监控

前端代码异常监控实战
http://www.cnblogs.com/hustskyking/p/fe-monitor.html

<script type="text/javascript"> 
  /** 
   * @param {String} errorMessage  错误信息 
   * @param {String} scriptURI   出错的文件 
   * @param {Long}  lineNumber   出错代码的行号 
   * @param {Long}  columnNumber  出错代码的列号 
   * @param {Object} errorObj    错误的详细信息，Anything 
   */
  window.onerror = function(errorMessage, scriptURI, lineNumber,columnNumber,errorObj) { 
    console.log("错误信息：" , errorMessage); 
    console.log("出错文件：" , scriptURI); 
    console.log("出错行号：" , lineNumber); 
    console.log("出错列号：" , columnNumber); 
    console.log("错误详情：" , errorObj); 
  } 
  </script>

• window.onerror
• window.onerror1
• window.onerror2
  // window.onerror 跨域的脚本 需要设置 crossorigin 属性和 Access-Control-All-Origin头部

1、添加script的crossorigin属性

2、配置一下服务器，设置静态资源Javascript的Response为Access-Control-Allow-Origin

https://cn.bing.com/search?q=前端代码异常

异常的处理

sentry 自动化异常提醒

retCode 阿里前端监控前端日志收集和监控

浏览器复制 粘贴 功能 copy paste

• 教程

// 获取当前网页的复制信息
window.getSelection(0).toString()
// 
window.document.body.oncopy = e=>{
    // todoSomething
    // e.
}

performance-report页面性能、资源、错误、ajax，fetch请求上报插件 前端监控

https://blog.seosiwei.com/detail/30

workbox3 : service Worker 可以如此简单

service worker的使用

webpack在线界面配置

https://webpack.jakoblind.no/

禁止.DS_store生成

禁止.DS_store生成：
defaults write com.apple.desktopservices DSDontWriteNetworkStores -bool TRUE
删除当前目录及其子目录下的所有.DS_Store 文件：
find . -name '*.DS_Store' -type f -delete

husky 限制本地的提交格式
git commit 提交规范 & 规范校验
https://blog.csdn.net/y491887095/article/details/80594043