解决 ESLint 错误 "no-unused-vars"

Question

错误

由于以下 eslint 错误，模块构建失败：

Error 1: 'player' is assigned a value but never used no-unused-vars

Error 2: 'YT' is not defined no-undef

Error 3: 'onYouTubeIframeAPIReady' is defined but never used no-unused-vars

代码

function videoInit() {
    // Initialise video
    var tag = document.createElement('script');
    tag.src = "https://www.youtube.com/iframe_api";
    var firstScriptTag = document.getElementsByTagName('script')[0];
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

    // Initialise the player
    var player;

    function onPlayerReady(event) {
        event.target.playVideo();
    }

    function onPlayerStateChange(event) {
        if (event.data === YT.PlayerState.ENDED) {
            event.target.playVideo();
        }
    }
    
    function onYouTubeIframeAPIReady() { 
        player = new YT.Player('player', {
            height: '100%',
            width: '100%',
            videoId: 'ScMzIvxBSi4',
            playerVars : {
                'mute' : 1,
            },
            events: {
                'onReady': onPlayerReady,
                'onStateChange': onPlayerStateChange,
            },
        });
    }
}

目标

正在解决 no-unused-vars & no-undef 错误。

函数调用不存在于本地文件中，而是来自 YouTube API 根据 documentation:

onYouTubeIframeAPIReady – The API will call this function when the page has finished downloading the JavaScript for the player API, which enables you to then use the API on your page. Thus, this function might create the player objects that you want to display when the page loads.

可以通过使用忽略错误 no-unused-vars /* eslint-disable no-unused-vars */，但我相信有更好的方法来解决这些问题。

非常感谢任何建议。

Answer 1

此函数应作为全局变量（= window 对象的属性）提供。就目前而言，它只是一个本地的，在 videoInit() 内可用 - 但不能从外部调用。所以 ESLint 实际上在这一点上是正确的。

使用类似于...

window.onYouTubeIframeAPIReady = onYouTubeIframeAPIReady;

至于player，只有在打算使用new YT.Player()调用（播放器实例）的返回值时才需要这个变量。在这种特殊情况下，您不使用它，因此会出现警告。考虑将 videoInit 变成 returns Promise 的函数（用 player 值解析）。

解决 ESLint 错误 "no-unused-vars"

Resolve ESLint error "no-unused-vars"

javascript

youtube-api

eslint