方案一:通过CDN地址引入
步骤一:通过CDN地址引入
<script src="https://cdn.bootcss.com/vConsole/3.2.2/vconsole.min.js"></script>
步骤二:实例化
<script> var vConsole = new VConsole(); </script>
demo:
<!DOCTYPE html>
<html lang="zh"><head><meta charset="utf-8" /><meta http-equiv="X-UA-Compatible" content="IE=edge" /><metaname="viewport"content="width=device-width,initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/><link rel="icon" href="favicon.ico" /><title>test</title><link href="./css/index.css" rel="stylesheet" /><script src="https://cdn.bootcss.com/vConsole/3.2.2/vconsole.min.js"></script></head><body><div id="pc"></div></body><script> var vConsole = new VConsole(); </script><script type="text/javascript" charset="utf-8" src="./js/自己的.js"></script>
</html>
步骤三、运行项目查看项目页面中是否出现一个绿色 vConsole 的按钮,点击该按钮便可以打开控制台
方案二:通过npm安装 vconsole 插件
步骤一、通过npm安装 vconsole
npm install vconsole --save-dev
步骤二、在项目入口文件中引入:
import vconsole from 'vconsole'
步骤三、实例化 vconsole:
var vConsole = new vconsole ()
步骤四、运行项目查看项目页面中是否出现一个绿色 vConsole 的按钮,点击该按钮便可以打开控制台