Débogage du code de production Vue 2 à l'aide des instructions du débogueur

Question

Je souhaite pouvoir détecter si l'utilisateur a ouvert des outils de développement dans mon application Web Vue 2. J'ai créé et construit l'application en utilisant @vue/cli 5.0.8 avec la configuration par défaut.

J'ai trouvé ce code, il devrait résoudre le problème -

const minimalUserResponseInMilliseconds = 100;
const before = Date.now();
debugger;
const after = Date.now();
if (after - before > minimalUserResponseInMilliseconds) {
  //Action
}

Mon problème est que la version de production par défaut de Vue nettoie les instructions du débogueur du code.

Existe-t-il une option pour conserver ce mot-clé spécifique du débogueur ? Ou même laisser toutes les instructions du débogueur inchangées ?

J'ai essayé d'ajouter ce qui suit à mon Vue.config mais le débogueur était toujours supprimé

configureWebpack: {
  optimization: {
    minimizer: [
      new TerserPlugin({
        terserOptions: {
          compress: {
            drop_debugger: false // 用于检查用户是否打开了开发者工具

Toute aide serait grandement appréciée, merci !

Answer 1

Vous pouvez peut-être utiliser « outHeight,outWidth/innerHeight,innerWidth » pour répondre à vos besoins.