w2-dev-badge

w2-dev-badge-osl.html

<script>
/**
 * @example
 *   /osltest|nucleus/ html://https://gist.githubusercontent.com/scplay/fa784b53b3ec713e837c441bb7f58f6c/raw/w2-dev-badge-osl.html
 */
(function () {
  var DEFAULT_BADGE_TXT = "w2";
  if (window.__W2_DEV_BADGE__) return;
  window.__W2_DEV_BADGE__ = 1;
  
  function detectDev() {
    var hits = [];

    // Vite dev server 注入的 HMR 客户端
    if (document.querySelector('script[src*="/@vite/client"]')) hits.push('vite');
    // Vite 依赖预打包目录，只有 dev 有
    if (document.querySelector('script[src*="/node_modules/.vite/"]')) hits.push('vite-deps');

    // React Fast Refresh 运行时，dev 专属
    if (window.$RefreshReg$ || window.$RefreshSig$) hits.push('react-refresh');

    // webpack / rspack HMR（Modern.js、CRA、Next pages）
    for (var k in window) {
      if (k.indexOf('webpackHotUpdate') === 0) { hits.push('webpack-hmr'); break; }
    }

    // Next.js pages router：dev 下 buildId 固定是 development
    var nd = window.__NEXT_DATA__;
    if (nd && nd.buildId === 'development') hits.push('next-dev');

    return hits;
  }

  function render() {
    var info = null;
    var hits = detectDev().join('-')
    try {
      // <meta name="x-w2-dev" badge="local" dir="r" />
      var meta = document.querySelector('meta[name="x-w2-dev"]') || document.querySelector('meta[name="build-info"]');
      
      info = meta
        ? {badge: meta?.getAttribute('badge') || meta?.getAttribute('mode'), dir: meta.getAttribute('dir')} 
        : (window.__W2_DEV_LOCAL__ || null);
    } catch (e) {}
    
    var posCss = {
      l: ['left: 0', 'border-bottom-right-radius:6px'], 
      r: ['right: 0', 'border-bottom-left-radius:6px']
    }[info?.dir || 'r'];
    var el = document.createElement('div');
    el.textContent = info?.badge || hits || DEFAULT_BADGE_TXT;
    el.title = 'whistle 已命中：' + location.host + '\n点击隐藏';
    el.style.cssText = [
      'position:fixed', 'top:0', ...posCss, 'z-index:2147483647',
      'padding:3px',
      'font:700 10px/12px ui-monospace,Menlo,monospace',
      'background:#c8c8c8', 'color:#000',
      'text-shadow:0 1px 0 rgba(255,255,255,.9)',
      'box-shadow:0 0 0 1px rgba(255,255,255,.85),0 1px 4px rgba(0,0,0,.45)',
      'cursor:pointer', 'user-select:none'
    ].join(';');
    el.onclick = function () { el.remove(); };

    document.body.appendChild(el);
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', render);
  } else {
    render();
  }
})();
</script>