vConsole一個輕量、可拓展、針對手機網頁的前端開發者除錯面板。vConsole.js 重寫console方法，實現了類似於微信小程式的移動端除錯效果。

• 直接引入使用

  <script src="https://cdn.bootcdn.net/ajax/libs/vConsole/3.9.0/vconsole.min.js"></script>
  <script>
      // init vConsole
      var vConsole = new VConsole()
      console.log('Hello world')
  </script>
  

• npm安裝使用

  // 安裝
  npm install vconsole
  
  // 初始化 & 配置 (main.js)
  import Vconsole from 'vconsole'
  const vConsole = new Vconsole()
  // window.vConsole = new VConsole()
  

• vconsole在開發環境（在npm run serve時）顯示，生產環境（在npm run build時）不顯示

  // (main.js)
  if (process.env.NODE_ENV !== 'production') {
    window.vConsole = new VConsole()
  }
   
  

• 設定樣式區分宿主

  .vc-switch {
    background-color: blue !important;
  }
  

VConsole 只是 vConsole 的原型，而非一個已例項化的物件。所以在手動 new 例項化之前，vConsole 不會被插入到網頁中;未載入 vConsole 模組時，console.log() 會直接列印到原生控制檯中；載入 vConsole 後，日誌會列印到頁面前端+原生控制檯。