Vue 打包的 html 怎么样禁止打开 F12 开发者工具呢？

把你想到的启动它的方式都禁止就行了.

禁止F12

window.onkeydown = window.onkeyup = window.onkeypress = function (event) { // 判断是否按下F12，F12键码为123 if (event.keyCode = 123) { event.preventDefault(); // 阻止默认事件行为 window.event.returnValue = false; } }

禁止右键

// 为右键添加自定义事件，可以禁用 window.oncontextmenu = function() { event.preventDefault(); // 阻止默认事件行为 return false; }

禁止预先调试和快捷键组合

提前打开调试窗口，然后在地址中输入网址，这样就算不用右键和F12也是打开调试窗口的；

通过浏览器菜单打开开发者工具来开启调试窗口，还有诸如 shift+ctrl+i 的快捷键打开控制台

对于这种预先打开调试窗口的方法，我们可以通过比较屏幕 window.outerWidth 和页面可见内容区域 window.innerWidth 的差距判断是否打开控制台

var threshold = 160; // 打开控制台的宽或高阈值 // 每秒检查一次 window.setInterval(function() { if (window.outerWidth - window.innerWidth > threshold || window.outerHeight - window.innerHeight > threshold) { // 如果打开控制台，则刷新页面 window.location.reload(); } }, 1e3);